Select Page

IE Responsive Style Problems – SOLVED

In the rush to make everything responsive, developers drove past one need: IE compatibility. A site with a responsive grid system using media-queries could stuck displaying the mobile version, especially in IE8 and IE9. It becomes the default view even with the screen size set to what should be the standard desktop size (greater than 960px wide). The reason is that older versions of IE don’t support media queries. Older version of IE end up processing all the CSS rules, even those a full-width screen shouldn’t. To prevent this problem, add the only keyword after each @media rule ( @media only screen … ).

@media screen (max-width: 1199px)

needs to become

@media only screen (max-width: 1199px)

Simple, huh?
Let me make it more simple: