[Resolved] Element spacing between sidebar widgets

[Carlos Paramio]

Good evening,

When I set the Element Spacing/Sidebar Widgets/Bottom to 0, it creates a bigger “Separating Space” between some of the widgets (not between all of them) than it’s set.

If I set Element Spacing/Sidebar Widgets/Bottom to 1, everything in the sidebar gets the same separation.

Is it a common issue?

Thanks

[Tom]

Hi Carlos,

I’ll have to look into that.

However, if you’re setting the separating space to 0, you may as well set the “Content Layout” to “One Container” in the “Layout” section of the Customizer.

That will achieve the same effect 🙂

[Carlos Paramio]

Thanks Tom, but what I’m setting to 0 is the bottom padding into the sidebar widgets.
I have removed a secondary menu from the sidebar and now between the widgets (except below the first one) there is an extra space. How can I get rid of that space?

[Tom]

Is it possible for you to link me to that page so I can inspect the code?

[Carlos Paramio]

Email sent

[Carlos Paramio]

Thank you very much Tom for your dedication (and patience!)

I have deleted all the widgtes off the sidebar and then a couple of them were added automatically (search case, archive, meta) and everything is fine between them.

So don’t worry, I’m going to play with the things I want to add and sooner or later I’ll find what’s wrong

[Carlos Paramio]

I think I found it:
When I add a couple of Visual Editor widgets with Element Spacing/Sidebar Widgets/Bottom set to 0, a blank space appears between the two widgets, even if Element Spacing/Separating Space is set to 0 too. Everything else unites but these two widgets remain detached from each other.

Then with that scenario, if I set Element Spacing/Sidebar Widgets/Bottom to 1, the two widgets merge among them but then some padding appears at the bottom of each one.

You can try by yourself, you have to put just 2 widgets

[Carlos Paramio]

Sorry for bringing this up again, I haven’t found a solution for this issue

[Tom]

I’m seeing it now.

Super weird, the bottom margin from the

tags is reaching outside of the widget instead of staying contained inside of it.

This can happen when floated elements aren’t cleared, but I’m not seeing any floated elements.

Are you using any plugins that would change the normal functionality of the widgets?

[Carlos Paramio]

Bingo!!

I was using the “Black Studio TinyMCE Widget” plugin. I´ve deactivated it and everything is fine.
There’re still a couple of Text widgets with incoherent spacing between them, but I should be able to make them have a good looking.

Is there a good plugin to put HTML into the widgets?

Thank you very much!

[Tom]

Hmm, you may be able to use that plugin and then add this CSS:

.widget p:last-child {
      margin-bottom: 0;
}

[Carlos Paramio]

Perfect! Thanks a lot!
I’ve activated again that plugin and added that CSS, everything is fine, even the embedded Google Map into the footer sidebar (question resolved here)

I see just one exception: when I add a Visual Text widget to the sidebar with plain text in any H (h1 to h6) or < pre > formats, extra space shows again between this widget and the next one. This behavior doesn’t happen when text is formatted as <p>

Thanks again Tom

[Tom]

This may work better:

.widget *:last-child {
      margin-bottom: 0;
}

[Carlos Paramio]

Yes, even better.
Extraordinay help 🙂

[Author]

Posts