При блочной вёрстке на основе плавающих блоков невозможно выровнять соседние колонки по высоте большей из них. Если, конечно не использовать фальшивых (лживых) колонок.

На помощь как всегда приходит javascript (jQuery):

HTML:

<div style="height:350px;" class="column"></div>
<div class="column"></div>

CSS:

.column {
    float: left;
    width: 200px;
}

jQuery:

var max_height = 0;
$("div.column").each(function(){
   if ($(this).height() > max_height) { max_height = $(this).height(); }
});
$("div.column").height(max_height);

Всем колонкам, за которыми нам нужно следить даём класс «column». Сниппет автоматически присвоит им высоту, равную большей колонке. В данном примере высота обеих колонок станет равной 350 пикселей.

Для вставки кода используйте HTML-теги
<pre><code class="php">ваш код</code></pre>

Добавить комментарий

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.

4 комментария

по хронологии
по рейтингу сначала новые по хронологии

Спасибо, друг! Как раз искал, чем заменить старый корявый скрипт, который вешал осла, и случайно попал на твой блог 🙂

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

И еще вопрос: можно я этот пост к себе в блог скопипастю? Я там полезные заметки храню, юзаю его как блокнот, который не потеряется.

Автор
Кобзарёв Михаил

Да пожалуйста, ставьте, куда хотите, только ссылку не забудьте.

Что касается скрипта, то достаточно добавить обработчик. Если нужно, могу подсказать.

Будет ссылка 🙂

Насчет обработчика - мне не нужно. Я его и сам напишу 🙂 А вот другим думаю полезно будет 😉

Автор
Кобзарёв Михаил

Тогда это тема для нового поста.