Archived topic
Header Image Gap on Smartphones
3 replies · Started by Zakia on June 8, 2016
Is there a way to prevent that white space from appearing in the header after the image on smartphones?
In reality I'd rather have 3 different images that are referenced for the three different sizes. Right now my header image is cut off in the desktop mode, looks okay in tablet mode, and has a bunch of white space under it in phone mode. I am viewing it through the Customize options in wordpress and toggling between the views.
If there is CSS to fix this can I place that in the simply CSS plugin?
Hi there,
Which image are you talking about?
Are you adding it as a background image perhaps? If so, try setting the size to "Cover".
The problem is, there is a 40px padding all around the header image/logo, etc for some reason and whoever designed this made it next to impossible to get rid of it.
It's actually very easy to get rid of it.
You can use the Spacing add-on in "Customize > Element Spacing" and set the header values to 0.
Or you can add custom CSS:
.inside-header {
padding: 0;
}Adding CSS: https://generatepress.com/knowledgebase/adding-css/
Hope this helps :)