css - Cordova application targetting S5 and Moto E -


i have application runs in portrait mode. want load css depending upon screen sizes s5 , smaller 1 moto e.

homescreenstyle , configurecss s5 homescreenstyleiphone , iphoneconfigure moto e

device pixel width pixel height css pixel ratio device-width device-height

moto e 960 540 2 480 270

galaxy s5 1920 1080 3 640 360

i tried different variations css not working,

 <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height">  <link  media="screen , (max-device-width: 350px)" href="assets/css/homescreenstyleiphone.css" rel="stylesheet"> <link  media="screen , (min-device-width:360px)" href="assets/css/homescreenstyle.css" rel="stylesheet">    <link   media="screen , (max-device-width: 350px)" href="assets/newcss/iphoneconfigure.css" rel="stylesheet"> <link   media="screen , (min-device-width:360px)" href="assets/newcss/configure.css" rel="stylesheet"> 

please help. unable figure out exact width.

in css file use width , height of element in percentage value, example

div.container { width:100%; height:100%; position:absolute; } 

it automatically fit element according device width, no need of more css files


Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -