CODEWITHSUNDEEP
htmlcsswordpresswordpress-themingcustom-wordpress-pages
Freddie
Freddie

Reputation: 3

Header height too big after uploading my logo

I'm working on a Wordpress website and I use the custom CSS to change small things from the template. So I only know how to work with html and CSS. But now I have a problem...

After uploading my logo, the header seems to stretch slightly out of proportion. There seems to be too much padding above the logo, more then below it, which makes it look uneven and the header just looks slightly too large on the whole. There is just too much white space in it… Whereas it was slimmer and a lot more streamline before uploading the logo.

The page I need help with: https://delizabeth.nl

Is there any way someone can help me fix this.

Upvotes: 0

Views: 1516

Answers (2)

Zubair Abbasi
Zubair Abbasi

Reputation: 9

you need to set class[widget] (padding: initial;) and you can set image height and width.

Upvotes: 0

ItsFlo
ItsFlo

Reputation: 103

Your header has a max-height of 200px. With the image added the way it is, the actual content exceeds that height and is cut off at the bottom.

Header exceeds max-height

The logo has padding around it and margin at the bottom. Since it only has margin at the bottom, the text doesn´t get verticaly centered to where the center of the image is but to the middle including the margin.

Logo padding and margin

If you remove the padding and the margin around the logo, then the extra whitespace will disappear and only the padding from the header itself will remain. It then all fits inside the max-height so nothing is cut off.

result

I don´t know how that theme works, but if it always has the same ID then the css would be:

#media_image-11 {
    margin: 0;
    padding: 0;
}

Upvotes: 1

Related Questions