2016-10-26 1 views
-1

Итак, у меня есть смешная проблема, которая должна быть очевидной и простой, но я не могу понять, в чем проблема.Div не будет поддерживать ширину в Safari на iPad

У меня есть div на странице, которая использует бутстрап.

Код для этого DIV выглядит следующим образом: -

.appSection{ 
    background-color: #000000; 
    padding:20px; 
    border:1px solid #67c1dd; 
    margin-bottom: 30px; 
    display: block; 
    width: 100%; 
    min-height: 450px; 
} 

Ее ребенок из ДИВ обертки Col-мда-12.

Этот дисплей отлично подходит для большинства браузеров, которые я использовал; однако, когда div не содержит большого количества контента или текста во главе div, на iPad div сжимается, как показано в правой части прикрепленного изображения. Иногда его можно буквально свернуть почти полностью справа от основного меню.

Любые подсказки? enter image description here

ответ

0

Вы не предоставили нам достаточно информации, чтобы уйти. Если бы мы могли увидеть образец html и css, это было бы здорово.

Если вы просматриваете его на iPad в портрете, то ваш класс «col-md-12» в родительском div не применяется, так как начинается с 992px. Это, вероятно, «часть» вашей проблемы. Это не первопричина, а. но нечего делать дальше, попробуйте изменить его на «col-xs-12» и посмотрите, исправляет ли он это.

+0

Я изменил запросы средств массовой информации на начальной загрузки, чтобы вызвать в разных разрешениях. Однако было достаточно сказать, что я знаю, что col-md-12 применяется, потому что навигационное меню «Приложение» изменяется на стиль, который вы можете видеть на изображении, когда применяется класс col-md-12. Я могу предоставить ссылку, где кто-то может увидеть проблему, но я бы предпочел сделать это в частном порядке. – Resurgent

+0

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

-1

Я нашел проблему.

Я имел этот мета-тег в верхней части моей страницы, когда я удалил его, проблема была решена: -

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
+0

Это не ответ на вашу проблему. Ваша страница не будет работать оперативно без метатега viewport. – partypete25