Властивість float та декілька блоків

Нехай тепер поряд у HTML коді буде не один див-нащадок, а два і обом заданий float в значенні left. Давайте подивимося, що буде:

<div class="parent"> <div class="child">1</div> <div class="child">2</div> довгий текст </div> .parent { border: 1px solid red; text-align: justify; } .child { float: left; width: 200px; height: 100px; border: 1px solid green; }

:

Отже, як ми бачимо, два блоки-нащадки вишикувалися до ряду, причому перший у HTML коді блок буде розташований ліворуч.

Давайте тепер замість значення left напишемо значення right. В цьому випадку блоки плаватимуть праворуч, причому порядок їх зміниться на зворотний порівняно з порядком у HTML коді:

<div class="parent"> <div class="child">1</div> <div class="child">2</div> довгий текст </div> .parent { border: 1px solid red; text-align: justify; } .child { float: right; width: 200px; height: 100px; border: 1px solid green; }

:

Повторіть сторінку за цим зразком: