Mobile version not full width when vertical.

I’m very pleased with Illdy thus far. My website loads properly on desktop but doesn’t properly show full width on when vertical on a mobile device, although it does go full width when horizontal. I read another post which referenced too large a logo

I have tried many different sizes and widths, but have not come to a solution.

Your advice is appreciated.

I have also a similar problem; when on mobile the hero page/ front page is not shown full width [regardless of the phone position: vertical/ horizontal]
Please kindly advise what to do.
Greatly appreciated,


You get this behaviour for the header image because it tries to fill all the space to the bottom of the heading sections, which would otherwise be white or blank color.

You can see a preview of the full-width photo by dropping the below code to Dashbboard > Appearances > Editor > Style.css (or other methods since this will be erased with the theme update):

#header {
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size: contain;
background-repeat: no-repeat;

If you don’t mind the picture repeating, you can delete the last line of the code.

Best regards

Is there a suggested image size for the header and for the jumbotron? I see nothing in the documentation, videos, or forums.