I'm using the Twenty Thirteen theme for my site, and although it's already mostly mobile-compatible, I'm having an issue with the header image. I created a header that's 640px wide for display on mobile devices with a screen size of 800px or less:
@media screen and (max-width: 800px) {
#masthead{
background: url('wp-content/uploads/2014/02/web_banner_640.png');
max-width:100%;
}}
However, when I see the site on my Samsung Galaxy S3, the header shows up extremely zoomed in so that only a small portion of the header is visible. How can I fix this?