The retina display media query is loading in IE7

[mhulse]

... and maybe other IEs. Either my syntax is wrong, respond.js is being too loose or, I don't know what.

The problem is that the retina display image is loading but background-size isn't taking affect because that's not supported CSS in old IEs.

Going to patch things for now and feed IE <= 7 non-retina graphics:

*background-image: url(./images/foo.png); /* IE >= 7 supports png32. */
_background-image: url(./images/foo.gif);

Long-term fix: Update my MQ syntax or see if someone on the respond.js end can fix that code to ignore my current implementation of a retina MQ with a max-width constraint:

@media
only screen and (max-width: 1319px) and (min--moz-device-pixel-ratio: 1.5),
only screen and (max-width: 1319px) and (-moz-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1319px) and (-o-min-device-pixel-ratio: 3/2),
only screen and (max-width: 1319px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 1319px) and (min-device-pixel-ratio: 1.5),
only screen and (max-width: 1319px) and (min-resolution: 1.5dppx) { ... }

The patch will work for now, but I want to re-visit this later when I have some more time to test and/or investigate.

[mhulse]

Going to use IE-specific classes (see #15) and:

.lt-ie9 .mk-toggle a { background-image: url(./images/toggle.gif); }

... hopefully respond.js will come up with a fix, or I'll figure out how to write my MQ so that IE ignores its contents.

[mhulse]

Done: 4e5cf93 (around thereabouts)

Leaving open for now. I really want to stop the MQ from loading vs. patch with some IE-specific CSS.