[Resolved] How to change the padding in the right sidebar widget ?

[Paolo]

Okay, so I put an image in the right sidebar widget of my site. But it doesn’t seem to fit well. There’s a big (and obvious) white space around. I think I need to change the padding but I don’t know how.

Can you please help me with it?

Thanks!

[bdbrown]

Hi Paolo. Can you post a link to your site so we can see the issue? Thanks.

[Tom]

Each sidebar widget has 40px of padding (by default).

You can remove the padding from widgets using our Spacing add-on, but that will apply to all widgets.

To target a specific widget, you’ll need to find the ID of that specific widget using your browsers “Inspect Element” tool.

For example, our 30 Day widget on the right has this ID: text-6

So to remove the padding, I would add this CSS:

#text-6 {
    padding: 0;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Franz]

Hi Tom,
I did it like this, but there is still a white border at the bottom and right side of the first banner of the sidebar. How i can remove this?

http://www.klavierspiel.com/blog/

[Tom]

Try adding this CSS:

.widget_siteorigin-panels-image img {
    vertical-align: bottom;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Franz]

Thank you, bottom is handeled.
Ther is still a thin white border at the right side.

[Tom]

I’m not sure what that white line on the right side is – it’s not CSS.

Try adding the widget in a regular Text widget using HTML:

<img src="URL TO THE IMAGE" alt="" />

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Franz]

Thank you, Tom.

It’s not that important.
But this thin white line ist still there if i change the background colour.
And it’s also visible on your page sidebar at the blue field “30 DayGuarantee!”
Maybe you have another idea.

[Tom]

That is super strange – I have three screens in front of me.

On two of them, there’s no line – on the third, which is the highest definition one, it’s there.

I’ll dig a little deeper to see if I can find the cause.

Thanks!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts