alexlip
Administrator
<div class="bbWrapper"><span style="font-size: 18px"><b>Пример горизонтального расположения нескольких блоков <div></b></span><br />
<br />
Для такого расположения блоков - всем div-ам присваиваем параметр <b>float:left; и радуемся жизни!</b> Для примера раположим несколько блоков <div> по горизонтали:<br />
<br />
<br />
<div class="bbCodeBlock bbCodeBlock--screenLimited bbCodeBlock--code">
<div class="bbCodeBlock-title">
Код:
</div>
<div class="bbCodeBlock-content" dir="ltr">
<pre class="bbCodeCode" dir="ltr" data-xf-init="code-block" data-lang=""><code> ------- установим стили блока DIV --------
#liniya {
width:110px;
height:50px;
background:#669900;
float:left;
margin-left:15px;
text-align:center;
}
---------- вставим блоки на страницу ---------
<div style=" width:100%; height:1px; clear:both;">.</div> чтобы не лезли вверх
<div id="liniya">DIV - 1</div> <div id="liniya">DIV - 2</div> <div id="liniya">DIV- 3</div>
<div id="liniya">DIV - 4</div><div id="liniya">DIV - 5</div><div id="liniya">DIV - 6</div>
<div style=" width:100%; height:1px; clear:both;"></div> чтобы ничего не влезало снизу</code></pre>
</div>
</div><br />
<br />
Если нужно расположить два больших блока в один ряд, тогда нужно параметрам <b>float:...;</b> задать значения <b>left</b> для одного и <b>right</b> для другого. Очень важно, чтобы общая ширина блоков не превышала ширину страницы, иначе ничего не получиться и один блок сместиться в нужную сторону, но располагаться будет под соседним!<br />
<br />
Вот так все просто и легко</div>