Hi Wes,
I’m trying to get this to work but have a feeling I have been starting at the screen for so long that I am missing something obvious. I am using the media query below however on a mobile device I end up with 2 logos showing slightly offset – the original (250px x 85px uploaded via custom header image) as well as the @2x version. Why is the custom header version not being overwritten?
Note: the problem will not be visible as the site is live – I have just commented out the media query until I can figure out what I am missing.
Any help would be appreciated! Thanks!
The site is crossfitnorthvancouver.com
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (min-resolution:120dpi) {
.custom-header .site-title a {
background: url(/wp-content/uploads/2014/05/logo@2x.png) no-repeat left !important;
background-size: 250px 85px !important;
}
}