Additional CSS codes to activate Retina file


Author Message
JTG

Posted: 5/5/2017
Quote message 

I am using an Artisteer created template in a WordPress site and I want to use additional coding to activate a Retina file of the header used in the template. I have uploaded the Retina header files, but can comeone help me with the proper coding to pu tin Additional CSS for the template? I used the codes below, but they don't seem to work:


@media
only screen and (-webkit-min-device-pixel-ratio:2),
only screen and (min-device-pixel-ratio:2) {
#headerimg {
background:url('http://thefamilyrules.com/wp-content/uploads/2017/05/TFR_header@2x.png') no-repeat left top;
background-size: 100%;
}
}

@media
only screen and (-webkit-min-device-pixel-ratio:2),
only screen and (min-device-pixel-ratio:2) {
#headerimg {
background:url('http://thefamilyrules.com/wp-content/uploads/2017/05/header@2x.jpg') no-repeat left top;
background-size: 100%;
}
} :-X