Есть ли какая-то возможность, без использования скриптов сделать такое:
[Резиновый DIV, растягивается от содержимого][Резиновый див, который занимает все оставшееся место]
Подробнее: Нужно сделать так, чтобы один из блоков занимал столько пространства, сколько ему нужно, чтобы отобразить все свои inline и block элементы(Нет их? окей, ширина 0). А другой блок растягивался на всю ширину оставшегося пространства.
Похожие, но не подходящие варианты:
Причина: фиксированная ширина первого дива
<div style="width:200px;float:left;">Первый див</div>
<div style="margin-left:200px;width:100%;">Второй див</div>
Причина: Второй див залезает под первый
<div style="float:left;">Первый див</div><div>Второй див</div>
Причина: Работает именно так, как нужно, но IE6 не понимает данное значение.
<div style="display:table;">
<div style="display:table-cell;">Первый див</div><div style="display:table-cell;">Второй див</div>
</div>
Решение:
GruZZ и
tenbits flack.ru/2008/08/26/semantic-coding-howto-6/
Способ: float:left; и owerflow:hidden;
<div id="All">
<div id="div1">One</div>
<div id="div2"> Two</div>
</div>
*{
padding:0px;
margin:0px;
}
#All{
font-size: 2em;
width:100%;
}
#div1{
float:left;
}
#div2{
overflow:hidden;
background: yellow;
}
MTonly tanalin.com/projects/display-table-htc/
Способ: эмуляция свойства display:table; при помощи расширения .htc
