Проблема с CSS в Chrome для Android

Question

Я разрабатываю очень простой отзывчивый веб-сайт. Хотя он отлично работает на Ответчика и Firefox для Android, некоторые из медиа-запросов и свойств CSS, похоже, не учитываются Chrome при запуске веб-сайта на моем Nexus 4.

Я использую в окне просмотра, размещенном на каждой странице, может возникнуть проблема?

<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 

Вот запрос СМИ на экран размера вызывает проблемы:

@media (max-width: 490px) { 
#welcome { 
    background-size: 16em 11em; 
} 
h1 a { 
    width: 70.6%; 
    font-size: 1.4em; 
    /*padding-top: 16px;*/ 
    padding-top: 0.7em; 
} 
h2.pageTitle { 
    font-size: 2.5em; 
    margin: 25% auto 10px auto; 
} 
p.pageDescription { 
    font-size: 1.2em; 
    width: 85%; 
} 
p.pageDescription:last-child { 
    font-size: 1.2em; 
    width: 85%; 
    margin: 0 auto 26% auto; 
} 
.workThumbnail { 
    height: 140px; 
} 
p.workThumbnailDescription { 
    font-size: 1em; 
} 
footer {height: 100%;} 
p.currentStatus {font-size: 1.6em;} 
p.copyright {font-size: 0.8em;} 
/* Movie Poster Page */ 
#OMthePostersEditorial { 
    width: 85%; 
} 
/* CAG Page */ 
#CAGourGoal {float: none;} 
#CAGourGoalEditorial { 
    width: 85%; 
} 
h2.caseStudyTitle {} 
p.caseStudyDescription { 
    font-size: 1.1em; 
} 
strong.titleItalic { 
    font-size: 1em; 
} 
/* Contact Page */ 
section.formContainer { 
    height: 100%; 
    padding: 10% 0 10% 0; 
} 
#contactForm { 
    display: none; 
} 
#contactMobile { 
    display: block; 
    margin: 0 auto; 
    width: 230px; 
} 
#contactMobile a { 
    text-decoration: none; 
    font-size: 1.5em; 
    font-family: 'HelveticaNeueLight'; 
    color: #252626; 
} 

}

Спасибо за вашу помощь.

Answer 1

Попробуйте добавить width в мета - содержание:

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