Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.60/5: Рейтинг темы: голосов - 5, средняя оценка - 4.60
1 / 1 / 1
Регистрация: 26.07.2013
Сообщений: 13
1

На мобильных устройствах ширина центрального блока уменьшается - подскажите решение

21.06.2017, 13:50. Показов 956. Ответов 2

Здравствуйте.
Столкнулся с такой проблемой:
На стационарных компьютерах верстка отрабатывает нормально, а на мобильных браузерах нет.
В мобильных браузерах средняя колонка уменьшается на 50% должной ширины.
http://c3w.ru/fotogalereya/ - альбомы должны располагаться в два столбика, а на мобильных браузерах они располагаются в один столбик. Т.к. ширина элемента со значением id="center" на мобильных устройствах почему-то меньше.
Кто по-опытнее: Подскажите пожалуйста почему на мобильниках ширина id="center" уменьшается и как эту проблему решить.
__________________
Помощь в написании контрольных, курсовых и дипломных работ здесь
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
21.06.2017, 13:50
Ответы с готовыми решениями:

Фиксированная ширина центрального блока
Я хочу сделать что-то вроде margin: 0 auto для центрального блока, и у центрального блока должна...

Сползание отцентрированного блока вправо на мобильных устройствах
Доброго времени суток! Прошу помочь разобраться вот в какой проблеме. Пытаюсь отцентрировать блок,...

Текст на мобильных устройствах не доходит до конца блока и переносится раньше
Сайт s-vanna.ru некорректно открывается на андроиде. Текст на обычных устройствах разъезжается по...

Шрифт на мобильных устройствах
Весь контент написан шрифтом Comic Sans MS. С ПК заходишь на сайт начертание шрифта верно. Но с...

2
6 / 6 / 1
Регистрация: 10.06.2014
Сообщений: 98
21.06.2017, 15:46 2
у меня вообще адаптивность не работает, загружается версия для ПК. так и должно быть?
0
1 / 1 / 1
Регистрация: 26.07.2013
Сообщений: 13
21.06.2017, 16:48  [ТС] 3
Лучший ответ Сообщение было отмечено Ghjy06 как решение

Решение

Да, конечно, адаптивность не делали пока. Все должно отображаться, как на desktope. Но на мобильных устройствах, почему-то элемент id=center почему-то намного уже ... у него справа, как бы отступ ...
Кто знает в чем дело, и как решить, подскажите пожалуйста ... Верстка стандартная, sitebaru задаем ширину и float:left; центральному не задаем ширину, но делаем отступ (margin) на ширину левой sitebara. Все должно работать, но нет (

Добавлено через 18 минут
Решил задачу, путем задания конкретной ширины для блока id="center".
Однако хотелось бы узнать, почему же все же некорректно работал на мобильниках?

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
#container {
min-width:1000px;
max-width:1000px;
margin:auto;
}
#left {
float:left;
width:300px;
}
#center {
margin:0 0 0 300px ;
padding:15px;
overflow:hidden;
}
HTML5
1
2
3
4
<div id="container">
    <div id="left">text</div>
    <div id="center">text</div>
</div>
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
21.06.2017, 16:48

Управление на мобильных устройствах
Как сделать управление в 3D игре через касание и перемещение пальца, то есть пользователь нажимает...

KeyDown на мобильных устройствах
На мобильных устройствах keyDown работает как keyUp, когда пользователь отпускает клавишу, как...

Маштабирование на мобильных устройствах
Помогите,пожалуйста.

JS события на мобильных устройствах
По проекту пишу обработчики событий наведения на элемент и выход за его пределы. Для этого с...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2022, CyberForum.ru