CSS media queries, pixel density, desktop and mobile devices

Question

Situation :
I have 5 CSS files:

• base.css with some styles that apply everywhere

• 339px.css for widths

Answer 1

Add this to your head:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width=device-width takes pixel density into account, so a device with true resolution of 640px width and 2.0 pixel density will have a browser viewport width of 320px. Initial scale ensures mobile browsers do not attempt to zoom to fit anything (for true fluid responsive sites).