Мобильное устройство показывает только 80% ширины страницы

Question

Я загрузил отзывчивый сайт, который я сделал для друга, который не отображает полную ширину на странице индекса, если смотреть на смартфоне или планшете.

Женщина делает мне одолжение, пытаясь узнать мое имя и работу. У нее есть бизнес, который она хотела бы видеть, и мы думали, что в Интернете есть место для начала.

Странно, что другие страницы сайта визуализируются только с правильной шириной и высотой.

Это заставляет меня думать, что проблема связана с запросами «@media screen».

Я полагал, что CSS-ширина и другие свойства и значения в кодах полной ширины, не являющихся мобильными страницами, будут «каскадом» вниз в меньшие мобильные запросы, но добавлены свойства «head», «html, body» и «нижний колонтитул», чтобы увидеть, улучшит ли это ситуацию.

Это не так.

На сайте можно посмотреть здесь: www.notaryonwheelsshaver.com

CSS-можно прочитать здесь: http://www.notaryonwheelsshaver.com/css/nows.css

Любая помощь будет принята с благодарностью.

Answer 1

Ваш первый медиа-запрос (780px) имеет опечатку в html,body ->height: 100%x; Это может мешать атрибуту min-width под ним.

Я не знаю, поможет ли это, но это то, что я заметил.

Answer 2

Я думаю, что этот вопрос находится в файле CSS:

html, body { 
     font-family: Tahoma, Helvetica, Arial, sans-serif; 
     font-size: 14px; 
     line-height: 26px; 
     background-color: #FFF; 
     color: #555; 
     padding: 0; 
     margin: 0; 
     height: 100%; 
     /*width: 100%;*/ 
    } 

/*width: 100%;*/ закомментирован, что делает браузер пропустить код, попробуйте изменить его на:

html, body { 
     font-family: Tahoma, Helvetica, Arial, sans-serif; 
     font-size: 14px; 
     line-height: 26px; 
     background-color: #FFF; 
     color: #555; 
     padding: 0; 
     margin: 0; 
     height: 100%; 
     width: 100%; 
    } 

EDIT: Вы имеете ширину также прокомментировал в:

.wrapper { 
     /*min-width: 100%;*/ 
     min-height: 100%; 
    }