Статьи  ->  Как зафиксировать высоту ячейки (строки) таблицы HTML, CSS

При верстке сайта, когда шаблон страниц создается на базе таблиц (table) имеет место одна неприятная заминка: невозможность зафиксировать высоту ячейки (строки), когда таблица включает в себя объединение строк. Такая особенность проявляется при использование IE или, по некоторым данным, и в FireFox. Хотя, я такой проблемы с ним не заметила. Google Chrome, кстати, тоже к такому порочному поведению не склонен и установленные высоты сохраняет.

Типичный html код расползающейся таблицы выглядит в простейшем случае так:

Здесь мы видим, что ячейка 2 объединяет строки, где размещены первая и третья ячейка. Когда мы начнем наполнять ее контентом, она начнет увеличиваться по высоте и тащить за собой ячейки 1 и 3, вызывая пропорциональное увеличение их высоты. Попытки зафиксировать высоту ячейки 1, используя HTML тег height или через CSS, ничего по большому счету не дают.

Проблему можно решить следующим образом: вместо ячеек 1 и 3 вложить дополнительную таблицу и контент размещать уже в ней. Наш код получит такой вид:

Теперь ячейка 2 может спокойно принимать любую высоту при ее наполнении, но высоты ячеек 1 и 3 останутся неизменны, что можно увидеть на рисунках снизу. Должна заметить, что использование таблиц не поощряется современными стандартами верстки сайтов. Лучше использовать блочные конструкции на базе тега div.