Разверните div, чтобы заполнить оставшуюся ширину - PullRequest
501 голосов
/ 11 августа 2009

Я хочу макет div с двумя столбцами, где каждый может иметь переменную ширину, например,

div {
    float: left;
}
.second {
    background: #ccc;
}
<div>Tree</div>
<div class="second">View</div>

Я хочу, чтобы div 'view' расширился до всей ширины, доступной после того, как div 'tree' заполнил необходимое пространство. В настоящее время мой div 'view' изменен на содержание, которое он содержит Также будет хорошо, если оба div'а занимают всю высоту

Не дублировать отказ от ответственности:

Расширить div до максимальной ширины, если установлен float: left потому что там левый имеет фиксированную ширину.

Помогите с div - приведите div в соответствие оставшейся ширине потому что мне нужно, чтобы два столбца были выровнены по левому краю

Ответы [ 21 ]

0 голосов
/ 11 августа 2009

Посмотрите доступные CSS-макеты. Я бы порекомендовал Simpl или, чуть более сложный, Blueprint framework.

Если вы используете Simpl (который предполагает импорт только одного simp.css файла), вы можете сделать это:

<div class="Colum­nOne­Half">Tree</div>
<div class="Colum­nOne­Half">View</div>

, для макета 50-50 или:

<div class="Colum­nOne­Quarter">Tree</div>
<div class="Colum­nThreeQuarters">View</div>

, для 25-75.

Это так просто.

...