Customizing responsive layout

wildgums

Hi,

I have a custom responsive css (which I add to the custom CSS page). 

@media only screen and (max-width:480px) {

body:not(.template-slider):not(.header-simple) #Header { min-height: 200px !important; background-position: center 202px; }

}

However... this doesn't work. When I go to the website, it shows that responsive.css?ver=9.5 overrules my customized css (and the !important is not taken into account). 

Any idea what could be wrong? Is it the loading order of the css stylesheets?

Albert

Hi,

any url to page where you used above css and does not work?

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

wildgums

http://www.wildgums.com

Albert

Your custom css is broken. You should use below css instead:

@media only screen and (max-width: 480px) { 
    body:not(.template-slider) #Header_wrapper { height: 200px !important; }
}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

wildgums

Thanks, that solves the issue.

Albert

No problem

Learn more: Video Tutorials | How To | FAQ Vote on what comes next