Hide header image in mobile device

Hi carligeanu. You would add a css media query to your child theme or custom css, and set it to the width of the viewport (screen) at which you want to hide the image. If you can post a link to your site I can work up a quick example for you.

Hey there carligeanu,

Hope you’re well today!

Try adding the following CSS code in the style.css file of your child theme or add it in your site using the following plugin:

http://wordpress.org/plugins/simple-custom-css

@media only screen and (max-width: 719px){
.topbar-enabled #header {
background: #fff;
}
}

This should replace the header image with the white color on lower resolutions. If you want another color simply replace the color hex value (#fff) to the one of your choice.

Hope this helps 🙂

Best regards,
Bojan

Hey again carligeanu,

Please try to replace previous code with this one:

@media only screen and (max-width: 719px){
.topbar-enabled #header {
background: #fff;
margin-bottom: -60px
}
}

Hope this helps 🙂

Cheers,
Bojan