문제

Problem

Css media queries are not working well in Smartphones and Phablets, but are working quite well in emulators. The problem is that the media queries are miss matching. for example my phone screen size is 320px but it applying 720px css.

Maybe

What I thing the problem arise due to absence of "(min-device-pixel-ratio : 1.5)". but i have no idea what is it and how to use it..

The Website

Hava look at the website | AtDrive.com

    @media only screen and (min-width: 480px) and (max-width: 619px)
    @media only screen and (min-width: 320px) and (max-width: 479px)
    @media only screen and (min-width: 250px) and (max-width: 319px)
    @media only screen and (max-width: 249px)
도움이 되었습니까?

해결책 2

Have a look some media queries

http://mediaqueri.es/

다른 팁

This is meta tag to your page.

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top