X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Проблема с шириной контента на мобильном, Контент шире экрана
PostBrigada
PostBrigada
Topic Starter сообщение 20.9.2016, 10:07; Ответить: PostBrigada
Сообщение #1


Доброе утро/день, помогите решить маленькую проблемку с шириной контента.
Получилось так, что сайту уже почти 2 года, но за неимением времени, только сейчас задумался о адаптации.
При проверке удобства просмотра на мобильных устройствах выдал мне, что Контент шире экрана.
Взглянув на смартфоне увидел, что действительно, с правой стороны появляется пикселей 10 пустого пространства, так как на смарте сдвигается шапка.
Подскажите что прописать в стилях, что бы на мобильных он сжимал шапку на ширину экрана, и не было выезда за пределы основного блока контента.

Пациент - drevologia.ru


--------------------
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
fantanella
fantanella
сообщение 20.9.2016, 10:36; Ответить: fantanella
Сообщение #2


PostBrigada,
дело не в том, что на смарте сдвигается шапка, а в том, что у вас фикс. ширина 1024пикс, поэтому считается, что контент будет шире экрана на устройствах с шириной меньше 1024 пикс.

А так я бы исправила:
Код
.header {
height: 345px;
background: url(images/head-bg.png) no-repeat;
background-size: 100% 100%;
}


на
Код
.header {
height: 345px;
background: url(images/head-bg.png) no-repeat;
background-size: cover;
}





Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
PostBrigada
PostBrigada
Topic Starter сообщение 20.9.2016, 10:53; Ответить: PostBrigada
Сообщение #3


не помогло(


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
fantanella
fantanella
сообщение 20.9.2016, 12:05; Ответить: fantanella
Сообщение #4


Brigada,
остался сдвиг или просто "Контент шире экрана" ?
По второму я вам уже написала, что у вас ширина фикс 1024 пикс. и такая фигня будет всегда - надо делать адаптив.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
PostBrigada
PostBrigada
Topic Starter сообщение 20.9.2016, 12:51; Ответить: PostBrigada
Сообщение #5


fantanella, сдвиг остался


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
indafaust
indafaust
сообщение 20.9.2016, 20:08; Ответить: indafaust
Сообщение #6


Если проблема только в сдвиге, то задай всем основным контейнерам ширину не через width, а max-width, контенту и сайдбару также, желательно в процентах. Тоже самое и картинкам стили max-width 100% и height auto. Ну а дальше гугли медиазапросы для адаптации сайта и тд.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
timurikvx
timurikvx
сообщение 20.9.2016, 20:34; Ответить: timurikvx
Сообщение #7


PostBrigada, попробуйте этот сервис от гугла.
А так отказывайтесь принципе от px в пользу %. Да и все равно через телефон смотреть десктопные сайты неудобно из за мелкого шрифта.
Предлагаю посмотреть в сторону <meta name="viewport" content="width=device-width, initial-scale=1.0">, а через медиа запросы подключать стили для требуемого экрана






--------------------
Пора верстать мышкой
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
PostBrigada
PostBrigada
Topic Starter сообщение 20.9.2016, 20:35; Ответить: PostBrigada
Сообщение #8


indafaust, сайт полностью не оптимизирован под мобильные устройства, это надо браться отдельно.
Сейчас просто хотел что бы на мобилах шапка была такой же ширины как и основной контент.


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
fantanella
fantanella
сообщение 21.9.2016, 10:02; Ответить: fantanella
Сообщение #9


PostBrigada,
честно говоря, вот так с наскоку не определить из-за чего сдвиг происходит. Надо сидеть и искать этот баг.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
PostBrigada
PostBrigada
Topic Starter сообщение 21.9.2016, 10:56; Ответить: PostBrigada
Сообщение #10


что то понять не могу, вроде ничего не делал, шапка к чертям пропала совсем, фон точнее ее. Сама картинка на месте. Помогите хоть назад вернуть)))

Сообщение отредактировал PostBrigada - 21.9.2016, 11:03


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыA-Parser 1.1 - продвинутый парсер ПС, кейвордов, контента, показателей, 70+ парсеров.
351 Forbidden 277477 11.3.2024, 13:49
автор: AParser_Support
Открытая тема (нет новых ответов) Дайте бесплатного контента! :)
2 Tia2 970 22.12.2023, 18:53
автор: zyzy
Горячая тема (нет новых ответов) Занимаюсь добычей качественного контента из Вебархива. Опыт уже более трех лет
Предоставляю только качественный, читабельный контент.
62 kuz999 37853 27.7.2023, 13:55
автор: kuz999
Открытая тема (нет новых ответов) Ищу помощника (SEO, сбор информации, размещение контента на сайтах, рутина)
0 rokot 796 8.2.2023, 18:35
автор: rokot
Открытая тема (нет новых ответов) Плагин для Wordpress. Вывод контента в зависимости от страны пользователя.
8 neuch 2255 19.9.2022, 7:51
автор: neuch


 



RSS Текстовая версия Сейчас: 19.3.2024, 7:27
Дизайн