Форум Сайтостроение Веб-строительство

прижать div`ы к низу родительского div`а

dimidrol
На сайте с 29.09.2005
Offline
191
dimidrol
7193 


<div id="content">

<div class="left">контент</div>

<div class="left">контент</div>

<div class="left">контент</div>

<div class="left">контент</div>

<div class="left">контент</div>

</div>

все div с классом left имеют разную высоту, неизвестную при построении страницы. как прижать их к низу родительского (id="content")?

Иногда полезно проигрывать - это держит тебя в тонусе... Мне так рассказывали (с) Shark Покупаю сайты (стройка/отделка/стройматериалы) по адекватной цене. Предложения в личку. Траф - обязателен
S
На сайте с 20.08.2007
Offline
140
somick
#1

#content { position: relative;}

.left { position: absolute; bottom: 0;}


Хотя, наверное, их еще и по низу расставить надо по порядку?

gormarket
На сайте с 29.12.2010
Offline
47
gormarket
#2

На практике не пользовался, чисто теория:

для дива id="content" задайте стилями display равным table-cell и vertical-align равным bottom

для IE6,IE7 работать точно не будет, для Safari 3.1 возможно придется еще заключить див id="content" в пару дивов со стилями display: table и table-row, в остальных браузерах может сработать.

Если не сработает, можно еще попробовать для class="left" задать display:inline и может быть задать ширину (если просто display:inline не поможет).

Можно еще не стилями, а скриптом задать для каждого дива class="left" собственное значение margin-top, чтоб все они были прижаты к низу родителя (уже после загрузки станицы у посетителя).

Товары и цены в магазинах Вашего города: Городской рынок (http://gormarket.ru/)
Выровнять заголовок CSS и наследование...тонкая штука... Какой код Adsense правильный?
Korew
На сайте с 31.12.2007
Offline
195
Korew
#3

Самый "грубый" способ - использовать таблицу и для каждого <td> задать valign="bottom"

Это на крайний случай, если ничего не поможет :)

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий