How to match header size to header image size

[Tully]

I am using a header image, but only a small height of the image was showing, so I adjusted the header bottom spacing until it is all showing. However, when viewed on different sized screens (ie. mobile) there is now a huge gap below the header due to the 400 pixel bottom spacing I have set on it, which works on desktop.

Is there a way to have the header size automatically adjust to the size of the header image?

Also, I am working on my site offline using Wamp, so can’t really show it to you, but if you check out http://www.campaspeworkingdogs.com (my current website using dreamweaver) you will see how I want it to look (I am making pretty much an exact copy lookalike in wordpress). Thanks

[Tom]

Sounds like you’re using a background image.

To make the background image cover the area regardless of screen size, choose the “Cover” option under “Size”.

However, I suggest adding it as a static image in “Customize > Site Identity”.

That way the image will always be responsive.

[Leon]

I’m working on a new site and have a similar issue. But I don’t see what you mean by adding a static image in “Customize > Site Identity”. All I see there is a place for the logo image.

[Leo]

That should be the place to add your image.

If this doesn’t help, any chance you can link me to the page in question?

Feel free to open a new topic as well as this one is from 2016.

Let me know 🙂

[Author]

Posts