SEO Сообщество: Спрашивайте и помогайте

Присоединяйтесь к сообществу профессиональных веб-мастеров PR-CY, отвечайте на вопросы коллег и задавайте свои.

Q&A SEO

Контент шире экрана - не могу понять в чем проблема

Пользователь #438416 Пользователь #438416  
0
  14.09.2017 10:32       1 474    
Вродебы везде установлено width:100% но все равно контент шире экрана. В чем проблема? https://d-ochag.ru/5920-2/

Ответы на пост (16) Написать ответ
xShift xShift
85
14.09.2017 10:35
А это что? min-width:100%;position:relative;
0
пробовал оставлять просто одну строчку <img style="width:100%;" title="Агентство недвижимости Домашний очаг" alt="Агентство недвижимости Домашний очаг" src="/1.png"/> Но все равно таже ошибка
0
sansan sansan
1680
14.09.2017 10:40
Ваш назойливый "Задать вопрос" и так всех распугает :) Не о чем беспокоиться.

ПО сабж:
.container_24 {width:960 px;}
Железобетонно заданная ширина. Класс и "фиксит" область просмотра, это не 100% и не auto.
0
sansan sansan
1680
14.09.2017 10:42
Так... подумалось, белое на желтом? Это издевательство для глаз.
0
Как только убираю <div style="min-width:100%;position:relative;">
<img style="width:100%;" title="Агентство недвижимости Домашний очаг" alt="Агентство недвижимости Домашний очаг" src="/1.png"/>
<div class="fontheadtop"><span>г. Калуга, ул. Театральная, д. 12, 3 этаж</span></div>
<div class="fontheadbuttom"><span>Телефон: +7 (4842) 21-21-17, +7 (910) 525-86-36</span></div>
</div>
<div class="menu2"> ... </div> Ошибка исчезает
0
sansan sansan
1680
14.09.2017 10:48
К слову, xShift тоже прав. Я "навскидку" подумал, что в "шапке" элементы адаптивны. Нет.
Похоже шаблон вообще не предназначен для мобильных устройств.
0
xShift xShift
85
14.09.2017 10:45
Блин. Вы перед тем как сайты делать хоть подучитесь маленько ... Приоритет правил CSS идет от заданных непосредственно в теле страницы или инлайновых. У вас прописано на блоке шапки сразу после body min-width:100%;position:relative; .

Почему не использована целиком сетка 960? Это что у вас за сайт мутант? Вы еще и сифон используете до сих пор когда CSS3 поддерживает font-face. Не представляю как вы это барахло будете оптимизировать под мобильные устройства.

Переверстайте пока не поздно под сетку https://1200px.com . Или другую так как 960 устарела.
0
xShift xShift
85
14.09.2017 10:46
Нельзя у img использовать 100% - вы должны точно в пикселях определить его размеры.
0
<div style="max-width:100%;position:relative;">
<img style="width:960px;" title="Агентство недвижимости Домашний очаг" alt="Агентство недвижимости Домашний очаг" src="/1.png"/>
</div> ошибка осталась
0
sansan sansan
1680
14.09.2017 11:00
Есть масса адаптивных шаблонов под WP.
Зачем "изобретать велосипед". "Немобильных" шаблонов - поискать нужно сегодня. Вы нашли.

Я сторонник стандартных решений :) "Перепилить" шаблон можно, а смысл? Ничего интересного в представленном нет, "бороться" не за что.
0
xShift xShift
85
14.09.2017 11:02
Пользователь #438416, браузер какой? у меня только Safari щас под рукой и под 1600px экрана все более менее нормально. Сделайте как вариант max-width: 95% и посмотрите что поедет. Вообще так делать нельзя, как у вас.
0
xShift xShift
85
14.09.2017 11:04
p.s.: тьфу ... я думал там просто логотип - а это вся шапка :D не могу вам больше ничего посоветовать. так не делают если по хорошему совета хотите - вы с этим вариантом такого говна наедитесь ...
1
xShift xShift
85
14.09.2017 11:07
p.s.s.: оставьте картинку коле она у вас на всю ширину. вот это попробуйте max-width:95%; margin: 0 auto;
0
Попробовал. Все тоже самое. Браузер Хром. Отображается тоже все корректно ошибку выдает гугл при проверке на мобильность
0
xShift xShift
85
14.09.2017 11:44
ну так так и надо было сразу уточнять. вы не сможете текущую версию шаблона адаптировать скорее всего. в хроме есть инструменты для проверки мобильности. но они не учитывают вечно отстающий и хромающий браузер базовый для андроид системы. тут вам придется самостоятельно ковыряться, но могу сразу сказать что такую шапку придется убирать. разберитесь с тегами viewport. если не сможете корректно настроить - просто выкиньте их.
0
Sergexpert Sergexpert
451
14.09.2017 12:04
Вот можно смотреть на всех устройствах. Может пригодится http://webmark.com.ua/mobile/
0