Задача высоты divs

Как получить, что div id = "left" имеет высоту, равную divs right_up и right_down вместе?Задача высоты divs

<div style="width: 1050px;"> 
    <div id="left" style="width: 80%;height:80%;min-height: 80%;float: left; background-color: blueviolet;">a</div> 
    <div id="right_up" style="width: 20%;height:40%;min-height: 40%; float: left; background-color: yellow;"> 
     <p>some text using paragraphs</p><p>some text</p> 
     <ul> 
      <li>some text using lists</li> 
      <li>some text</li> 
     </ul> 
    </div> 
    <div id="right_down" style="width: 20%;min-height: 40%;height:40%; float: left; background-color: aqua; margin-left: 80%;"> 
     <p>some text using paragraphs</p><p>some text</p> 
     <ul> 
      <li>some text using lists</li> 
      <li>some text</li> 
     </ul> 
    </div> 
</div>

источник

2010-10-22 Jane

о человеке, что встроенный CSS убивает меня – Claudiu

Используйте таблицы, они являются самыми простыми и самыми надежными, когда речь идет о табличных макетах. – mojuba

Столы не нужны. Этот макет довольно прост и просто нуждается в фоновом изображении на контейнере div, чтобы создать иллюзию равной высоты. – ghoppe

мне работает удаление

margin-left: 80%;

от сНа ид = "right_down"

источник

2010-10-22 22:25:04 Dalen

firefox и chrome, прямо сейчас я не могу проверить его на IE bucause Я на машине ubuntu – Dalen

Я пробовал ваше решение в мозилле и хроме. Это не работает. – Jane

Он работает для 2 других людей, но не вы? Я предполагаю, что у вас есть другой CSS, который мешает. – drudge

Обновлено
- Исправлено: Использование XHTML 1.0 Strict DTD
- Fix: Фон заполняет до высоты div#wrapper
- Broke: Нет больше приспосабливается к высоте браузера

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>div-height</title> 
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" /> 

<style type="text/css"> 
    div#wrapper { 
     width: 1050px; 
     height: 80%; 
     min-height: 80%; 
     background-color: blueviolet; 
     overflow: auto; 
    } 
    div#left { 
     width: 80%; 
     float: left; 
    } 
    div#right_up, div#right_down { 
     width: 20%; 
     height: 40%; 
     min-height: 40%; 
     float: right; 
    } 
    div#right_up { 
     background-color: yellow; 
    } 
    div#right_down { 
     clear: right; 
     background-color: aqua; 
    } 
    div.clearfix { 
     clear: both; 
    } 
</style> 

</head> 
<body> 

<div id="wrapper"> 
    <div id="left">a</div> 
    <div id="right_up"> 
     <p>some text using paragraphs</p> 
     <p>some text</p> 
     <ul> 
      <li>some text using lists</li> 
      <li>some text</li> 
     </ul> 
    </div> 
    <div id="right_down"> 
     <p>some text using paragraphs</p> 
     <p>some text</p> 
     <ul> 
      <li>some text using lists</li> 
      <li>some text</li> 
     </ul> 
    </div> 
    <div class="clearfix"></div> 
</div> 

</body> 
</html>

источник

2010-10-22 22:29:56 drudge

Как это .css сделать div # left полной высоты? – ghoppe

@ghoppe: понятия не имею, единственное, что я сделал, это отделить CSS от HTML. – drudge

Это не работает – Jane

Cheat.

источник

2010-10-22 22:35:45 ghoppe

Задача высоты divs

ответ

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