Archived topic
Need CSS for Negative Margins for Header Widget
5 replies · Started by Max on July 19, 2022
I need to add negative margins to my header widget because it is not aligning with my logo and has some sort of padding above the custom HTML text. I have tried quite a few different CSS codes I found in past support tickets but none worked thus far.
Header padding on top is set to 20px for the logo but it seems that the widget is calling out 40px somehow. To get around this I was just hoping for the CSS code so I can add negative margins for an easy, quick fix.
Can you help with this, please?
Note: We are just starting this build and it is in staging mode so feel free to mess with things if needed.
Thank you very much!
Hi Max,
Can you try to use Flexboxinstead Floats?
You can switch it at customizer > general.
Hi Ying,
That did help quite a bit. I changed the header padding for top & bottom to 0px but the widget still has more padding on top than the bottom and I need them to align.
Here is an example of what I see now: https://imgur.com/CuRqQPd
They are already aligned, but as the text has 1.5 as line height, it will include some part of the spacing to the text which makes it a bit off visually.
Try adding this CSS to set the line height to 1:
.header-widget .widget strong {
line-height: 1;
}Ying you are incredible! Exactly what I needed. Thank you so much! :)
You are welcome :)
