skip to main content

TAMU Webmaster's Blog


Information and insight from the A&M Webmasters

Solving Quirks of Internet Explorer 11

June 17th, 2014 by mdmcginnis

I have a confession: I hacked Internet Explorer 11. And Internet Explorer 10. I moved the search button up one pixel on http://visit.tamu.edu/ – but only in IE. It was difficult because, unlike previous versions of Internet Explorer, conditional comments don’t work on IE10 or 11. But I’m not ashamed. True, I was told that if I had any problems with Internet Explorer 10, it must be MY CODE, since Internet Explorer 10 was now bug-free and standards-compliant. So why did the search button look fine on other browsers? The extra pixel was also needed for IE7 and IE9. IE8 required two pixels.

Technically, the media query isn’t a hack, it’s feature detection – though not the kind that Modernizr is famous for.

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
   #searchButton {
        margin-top: 1px;
    }
}

That’s the CSS that fixed my search button: There are other ways to target recent versions of Internet Explorer, but this one seemed the cleanest. Microsoft’s recommendation: add a meta-tag <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9"> to make the browser pretend it’s IE9. Except… I don’t want to go back to IE9.

Tuesday, June 17th, 2014 CSS
Share this article

1 Comment to Solving Quirks of Internet Explorer 11

  1. What a backwards (pun intended) recommendation from Microsoft.

  2. Tracy Persky on June 17th, 2014

Leave a comment

Categories

Archives