 Сетка, состоящая из двух колонок, часто используется в сайтостроении, при этом в одной колонке размещается основная информация, а во второй – дополнительный контент (ссылки, реклама и т.д.). Ширина колонок Данный параметр можно указывать независимо от того в какой колонке будет размещен основной или дополнительный контент. Например, чтобы задать фиксированную ширину (в % или рх) для левой колонки и «плавующую» для правой колонки, зависящую от окна браузера, то для этого используют атрибут width в теге <table> (для всей таблице) и в теге <td> (для первой ячейки). Содержимое ячеек лучше выравнивать по вертикали с помощью атрибута valign, в котором будет прописано значение top. Данный способ позволит сделать так, чтобы содержимое ячеек начинались от верхнего края и не сдвигались. Цвет фона колонок Зачастую необходимо сделать так, чтобы можно было визуально быстро отличить колонки друг от друга. В этом случае для колонок задают фоновый цвет. Делается это через стилевой класс, в котором прописывается свойство background, и назначают его к необходимой ячейки.  Разделитель колонокРасстояние между колонками можно создавать с помощью полей, но этот способ не совсем удобен, например, когда поля, находящиеся вокруг контента, нельзя включать из-за разных нюансов. Здесь помочь добавление дополнительной ячейки, которая будет сложить разделителем колонок. Или же можно добавлять еще одну колонку, задав ей имя spacer, и спокойно менять расстояния между колонок. Линия между колонок Колонки можно разделять не только пустым пространством и фоновым цветом, но и при добавлении линий. Для этого каждой колонке необходимо прописать свойство – для левой border-right, а для правой border-left. При конструировании двухколонного макета использование таблицы сделает данный процесс быстрым и простым. Все что необходимо – это сделать таблицу, в которой будет две ячейки, а потом им просто задавать необходимые параметры и свойства. |