Header Images not stretching across screen in chrome. But your demo beblogger 2 site does.

johnwai82 · August 2016

Header Images does not stretch across screen in chrome with the demo data and content imported. How do I fix this ? Your beblogger2 demo also viewed in chrome looks fine. This happens in Chrome only, site looks good elsewhere. I am also using a 42" tv as monitor which shouldn't be the problem. Please could you help.

My site: http://www.waienterprise.com/2014/03/12/1-2/

Yours: http://themes.muffingroup.com/be/blogger2/14-2/

Your site viewed in chrome:

johnwai82 · August 2016

Like to add the same issue applies to the about us page in which the header is created from muffin-builder. I have tried many settings to fix this but the issue is still the same. Please see images below:

My site:

Your site (beblogger2 demo) viewed in Chrome:

Albert · August 2016

Hi,

to stretch background header across the width, you need to use the following css:

body:not(.template-slider) #Header_wrapper { background-size: cover !important; }

johnwai82 · August 2016

Hi,

Thanks, my header issue has been resolved.

However the issue remains with normal images. Or in the example above from your beblogger2 about us page. This was created in muffin builder as the top level background image with parallax effect applied to it. Padding top 220 and bottom 110. I tried settings like maximum width however it is not stretching across. How do I go about fixing this ?

Albert · August 2016

@johnwai82 Try below instead:

.section { background-size: cover !important; }

Header Images not stretching across screen in chrome. But your demo beblogger 2 site does.

Comments