Responsive css settings

Having some problems with the responsive column settings for the Sidebar Right layout, specifically for mobile. I can get around this by adding custom css but I’m wondering if this is how it’s designed?

  • When setting a custom mobile width for the sidebar, the max-width on .fl-col-small remains therefore limiting the width
  • float:left stays applied to .fl-node-ID which pushes the column against the edge of the window

This is unrelated but is there any way to change the default args for widgets? Specifically before_title and after_title? The default is < h2 class=“widgettitle” > < /h2 >

Or would I be better off adding the sidebar instead of widgets.

Hey Tim. Thanks for reaching out with your question. I am having a bit of trouble understanding where the issue is. Can you please post the CSS that you’re using to fix the issue, and or, explain in a bit more detail? It sounds like you might be trying to make the sidebar full width on mobile, and the max-width and float is causing an issue?

On your second issue, again I am having a bit of trouble understanding. Can you elaborate a bit on the problem or what you’re looking to do?

Thanks much!

That is exactly the problem. I would like the sidebar to be full width on mobile but the max-width for .fl-col-small is stopping that. I suggest setting max-width and float for tablet-up.

Nevermind about the second question, I’ve found a workaround – leaving the title of the widget blank and using the header module to display a title.

Ah, okay. I was chatting with Justin (he’s the lead dev) about this, and we did do this intentionally. In most situations, content that was designed for a small column won’t look as good if it’s stretched beyond that 400 pixel maximum. Our philosophy with Beaver Builder is that we do everything we can to make it easy to create good looking pages. If you opt to override our “suggestions” that’s a-okay! But, we set that 400 pixel limit because generally content looks better that way.

Glad your second question got resolved.