Html и высота тела не 100%

У меня есть мобильная страница jquery. Даже я устанавливаю 100% на html и body, высота html и body по-прежнему не совпадает с содержимым контейнера (дескриптор-контейнер). Для этого примера jsfiddle высота его тела составляет около 300 пикселей, но высота посадочного контейнера составляет около 1600 пикселей. Я использую Chrome. Почему это происходит, и есть ли способ обхода?Html и высота тела не 100%

html, body { 
    min-height: 100%; 
    -webkit-text-size-adjust: 100%; 
} 

<html> 
<body> 
<div id="holder" data-role="page" data-theme="none" data-ajax="false"> 
    <div class="header"> 
    </div> 
    <div class="landing-container"> 
    </div> 
</div> 
</body> 
</html>

Вы можете проверить его здесь. http://jsfiddle.net/angelohuang/brbqh/4/

источник

2013-04-09 angelokh

Вы говорите о высоте контента, потому что html и высота тела не учитываются в jQuery Mobile? – Gajotres

Если вы посмотрите на высоту держателя элемента ui-page, то это 100%. Однако тело и html не покрывают его на 100%, а только верхнюю часть. Я предполагаю, что родитель должен иметь ту же высоту, что и высота детского контента. – angelokh

Проблема в том, что в вашем примере трудно видеть то, что вы хотите. Можете ли вы создать простой пример jsFiddle или, по крайней мере, очистить некоторый HTML. – Gajotres

Возможно, у вас есть position: absolute?

Абсолютное позиционирование выводит элемент из нормального потока макета и, следовательно, не влияет на его родительскую высоту.

Похоже, что jQuery mobile добавляет многие из этих стилей в результате работы data-role. Я лично не знаком с мобильным телефоном jQuery, но, возможно, вы используете его нестандартным способом?

EDIT

О, Хаха. Это также сделало бы это:

.ui-mobile, .ui-mobile body { 
    height: 99.9%; 
}

Таким образом, он никогда не становится больше, чем высота окна, если только я не смущен.

источник

2013-04-09 22:51:53

Вы правы. Если я прокомментирую позицию: абсолютный из атрибутов css-дескриптора-контейнера, его родительский (.holder) теперь содержит всю высоту детей. Однако тело и html все еще короче. Я не думаю, что это 99,9%, потому что разница составляет более 1000 пикселей. – angelokh

Что произойдет, если вы измените это на 'height: auto;'? Я не предполагаю, что это «расхождение 0,1%», но процент будет относительно высоты окна (видимый на экране), а не его содержимого. –

Html и высота тела не 100%

ответ

Смежные вопросы