| |
|
|
| | Привет!
После изучения статей по выравниванию блоков по горизонтали так и не получилось решить следующую задачу.
Есть 3 плавающих блока с конетентом (блоки 1,2,3 ; блок 2 - посередине ), у блоков выставлено float:left (чтобы выстроились горизонтально, кстати, может в данной задаче так не стоит делать их плавающими?).
Блок 2, то есть центральный блок, имеет фиксированную ширину(напр. 300px) и находится между двумя другими блоками 1,3.
Необходимо выравнять все 3 блока по центру внутри родительского контейнера, то есть чтобы эта троица стояла в центре родительского контейнера и была отцентрирована по горизонтали, и сделать так чтобы ширина крайних блоков 1,3 растягивалась во всю оставшуюся ширину страницы до её краёв.
Я пробовал среди других способов объединить 3 блока в другой контейнер, а потом выравнять его относительно родительского - также не получилось.
<html>
<head>
<title>Untitled</title>
<style type="text/css">
.cont
{
float:left;
}
</style>
</head>
<body>
<div align="center" style="border:solid 1 lime;">
<div style="border:solid 1 red;background:orange;" class="cont">блок-контент 1</div>
<div style="border:solid 1 red;background:yellow;width:300px" class="cont">блок-контент 2 (ширина задана,фикс)</div>
<div style="border:solid 1 red;background:orange;" class="cont">блок-контент 3</div>
<div style="clear:both"></div>
</div>
</body>
</html>
|
Как это можно было бы осуществить или укажите похожий пример пожалуйста.
Спасибо | |
| |
|
