Media type inside link not working in IE 10

I’m trying to add media types in links so that different css files are loaded according
to the screen width or height. This is helpful if I want to support for windows phone also. 

I added the following code in my index.html page. This should check for the screen width and
the file should be loaded according to that. 

<link type="text/css" rel="stylesheet" href="resources/css/app_phone.css" media="only screen and (max-width: 480px) and (-webkit-max-device-pixel-ratio: 1)"> <!-- Phone ~ Retina --> <link type="text/css" rel="stylesheet" href="resources/css/app_phone_retina.css" media="only screen and (max-width: 480px) and (-webkit-min-device-pixel-ratio: 1.1)">

.

.

.

This works well for chrome or android and IOS devices.
But when I try to use the same code for windows or on IE, it doesn’t work.
Please help me resolve this.
Thanks

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s