CSS, Абсолютные divs в относительно позиционированном div

Учитывая следующий код, как можно увеличить высоту обертки div до конца.CSS, Абсолютные divs в относительно позиционированном div

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
<meta content="en-us" http-equiv="Content-Language" /> 
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> 
<title>Untitled 1</title> 
<style type="text/css"> 
.wrapperDiv { 
    position: relative; 
    width: 800px; 
    background-color: #FFFF00; 
    margin-right: auto; 
    margin-left: auto; 
} 
.content { 
    position: absolute; 
    width: 95%; 
    top: 55px; 
    background-color: #008000; 
} 
.footer { 
    position: absolute; 
    width: 95%; 
    height: 50px; 
    background-color: #FF00FF; 
    bottom: 5px; 
} 
.header { 
    position: absolute; 
    width: 95%; 
    height: 50px; 
    background-color: #CCFF33; 
    top: 5px; 
} 
</style> 
</head> 

<body> 

<div id="wrapper" class="wrapperDiv"> 
    <div id="layer2" class="footer"> 
     3</div> 
    <div id="layer3" class="header"> 
     1</div> 
    <div id="layer1" class="content"> 
     2<br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     END</div> 
</div> 

</body> 

</html>

источник

2009-10-16 ace

Добавить это:

html, body, .wrapperDiv { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
    min-height: 100%; 
}

Вам будет иметь проблемы с вашей wrapperDiv быть шире, чем дивы она содержит. Не уверен, что вы хотите с этим поделать.

источник

2009-10-16 06:11:03 cletus

Спасибо за ваш ответ, я не мог решить проблему, закончив тем, что использовал фоновое изображение. – ace

Вы можете использовать javascript, чтобы получить смещение абсолютного элемента и добавить его к высоте вашего родительского div.

источник

2009-11-05 16:19:00

Спасибо за ваш ответ, я не мог решить проблему, закончив тем, что использовал фоновое изображение. – ace

CSS, Абсолютные divs в относительно позиционированном div

ответ

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