тело не покрывает высоту документа

Question

тело не покрывает высоту документа

0

<html>
<body>
    <img id='imgTest' src='https://www.google.com/images/srpr/logo11w.png'>
</body>
</html>

CSS

html{
    height:100%;
    background:blue;
}
body{
    height:100%;
    background:yellow;
}
#imgTest{
    position:absolute;
    height:700px;
    width:200px;
    top:14px;
    left:25px;
}

Мне нужно тело, чтобы покрыть всю высоту документа и держать imgTest абсолютно позиционированным.

здесь FIDDLE

bonaca 13 дек. 2013, в 17:47

Источник

Теги:

html

css

2 ответа

Ещё вопросы

Arjan · Answer 1 · 2013-12-13T14-01-00.000Z

Стандартная проблема с абсолютно позиционируемыми элементами. Чтобы убедиться, что элемент окружающего body имеет правильный размер, вам необходимо указать его:

body{
    height:100%;
    background:yellow;
    margin: 0;
    min-height: 714px; /* height of image + top of image */
}

Смотрите обновленную скрипку.

Арджан, предположим, что у посетителя есть монитор высотой 720px. Тело все еще не покрывает весь видимый документ!
В этом случае height: 100% прежнему должна давать телу достаточную высоту, чтобы закрыть порт просмотра, поэтому фон будет желтым.
Арджан, но я не знаю, какова высота показа посетителей? Итак, что я должен написать: height:100% или min-height:... ? Мне нужно тело, чтобы покрыть высоту документа для каждой высоты отображения.
Вы должны использовать и height: 100% и min-height: 714px .

Yuriy Galanter · Answer 2 · 2013-12-13T13-35-00.000Z

0

Вы должны добавить

 margin:0

к телу CSS

Yuriy Galanter 13 дек. 2013, в 13:35

2

Это все еще оставляет большой разрыв под изображением.
j08691 13 дек. 2013, в 16:30
0

Юрий, пожалуйста, попробуйте решение перед публикацией. Не работает
qadenza 13 дек. 2013, в 16:31
0

Да видел свиток ниже. Продолжим смотреть
Yuriy Galanter 13 дек. 2013, в 16:34
0

Хорошо, как насчет простого удаления любого стиля для HTML и оставления основного: jsfiddle.net/SAf2a/5
Yuriy Galanter 13 дек. 2013, в 18:25

Показать ещё 2 комментария