Проблема с выравниванием div

[thekap]

Как сделать так, чтобы один див прижимался к левому краю, а другой к правому и при этом никуда не пропадал базовый div? Вот, что имеется в виду:

<div style="background: #f6f6f6;">

<div style="float: left;">123</div>

<div style="float: right;">456</div>

</div>

Проблема в том, что при таком раскладе базовый div (тот, что с бекграундом) как бы схлопывается. Однако если ему указать высоту в 1 пиксель, то в IE всё работает просто замечательно. Базовый div сразу подстраивается под высоту двух других. А вот в FF и Opera этого почему-то не происходит . Как решить такую проблему без задания высоты каждому диву, так как она может быть разной?

Вариант с 1 пиксельной высотой хорош, но работает только в IE.

Edited February 15, 2011 by thekap

[LeD4eG]

я думаю, стоит задать ширину родительского дива. это поможет решить Вашу проблему. высота родительского будет выстраиваться по высоте дочерних, чтобы вместить их полностью, а заданием ширины родительского Вы сможете выровнять дочерние блоки как Вам нужно (по левому или по правому краю). попробуйте так.

[thekap]

С шириной в IE6 работает почти, как и с высотой (за исключением некоторых нюансов), а в Opera и FF то же самое, что и с высотой, то есть ноль реакции. Базовый див схлопывается, а остальные два висят как ни в чём не бывало справа и слева.

[Vind]

Вроде overflow: hidden; для родителя должен помочь

[thekap]

Vind, спасибо! Помогло и в IE работает, и в Opera, и в FF.

[Vind]

рад что был хоть кому то полезен