CODEWITHSUNDEEP
htmlcssgoogle-chromeresponsive-designmedia-queries
yarek
yarek

Reputation: 12064

css3 viewport : works on chrome simulator, not on android phone

I am using @viewport CSS3 (since viewport meta is not flexible enough for me). My design is 960px width. When I use the Google Chrome Dev tools and simulate Samsung S4, this works perfectly. When I open the page on my real Samsung S4 device in chrome navigator, it looks like this CSS rule was not applied (I emptied my Samsung S4 chrome cache)

Why does this work fine on the Chrome simulation but not the device?

@media screen and (min-width: 320px)  {
   @viewport { 
    width: 960px; 
    orientation:landscape;
   }
}

Upvotes: 0

Views: 145

Answers (1)

Callum
Callum

Reputation: 40

I've pulled this answer from here.

Try adding <meta name="viewport" content="width=device-width" /> in the <head> of your HTML document

Upvotes: 1

Related Questions