3 колонки с помощью DIV (средняя гибкость, вся гибкая высота, режим STRICT)

Question

Эй, ребята, я немного боролся с этим и, похоже, не нашел решения. Нужен совет или простое утверждение о том, что это невозможно (пока я думаю, что это невозможно). Проблема в следующем: нужно 3 столбца с гибкой шириной, слева фиксированной ширины, справа также, посередине - занимает все пространство, предоставленное телом или чем-то еще. Хитрость в том, что правый или левый столбцы могут быть выше среднего, и нам нужно, чтобы они не перекрывали нижний колонтитул. Также docmode является строгим. Я знаю, что Таблица решает проблему за секунду, но мне интересно, есть ли решение Div вокруг?

Answer 1

Я думаю, это то, что вы ищете:

http://matthewjamestaylor.com/blog/perfect-3-column.htm или с шириной пикселя: http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm

Он строгий XHTML и поддерживает все текущие браузеры.

Answer 2

Никаких испытаний за столами для меня все равно что помахать красным быком:

http://edeverett.co.uk/experiments/noTables2.html

Протестировано в IE7, FF3, Chrome 2.

Это должно помочь вам в этом, основная идея - использовать отрицательные поля в двух боковых столбцах, для основного столбца установлено значение ширины 100%. Было бы полезно иметь нижний предел ширины страницы.

(я отредактировал пример html, чтобы показать, как включить контент в центральную часть)

Answer 3

YUI Grid CSS , вероятно, то, что вы хотите. Я не знаком с магией CSS, но она поддерживает несколько разных макетов. Кажется, он не поддерживает фиксированные левый и правый столбцы.