Header image not responsive

Supurderek · March 2016

www.aquarium-depot.com

I am not sure what I am doing wrong. I remember the header image would resize depending on the window screen size. It doesn't change size regardless of what I do. Just updated to the newest version of the theme as well. Help!

Supurderek · March 2016

I noticed it resizes for smartphone correctly but for the other 3 sizes, it does not.

Albert · March 2016

Hi,

we have no idea where did you read that css background resizes but these are nonsense. CSS backgrounds and responsive are technically incompatible and backgrounds won't never resize.

Thanks!

Supurderek · March 2016

I was talking about the header image. Not the background.

Supurderek · March 2016

The image that has the two logos and DEPOT in the middle.

Albert · March 2016

Ok, we got it. So we are going to explain where the problem is. The logo displays as inline-block which is necessary. 99% of people, uses small logos and inline-block style is necessary so they can align logos in different ways. The problem is when the logo is as big as on your site. Then on some screens, it does not resize. So in your case, you need to use the following css:

.header-stack #Top_bar .logo #logo {
    display: block;
}

Supurderek · March 2016

Thank you so much! You guys are awesome!

Albert · March 2016

You are welcome

Header image not responsive

Comments