Версия для печати темы

Нажмите сюда для просмотра этой темы в обычном формате

Форум веб-мастеров _ Языки разметки (HTML, XML, CSS, ...) и JavaScript _ Расположение трёх колонок (div-вов) с помощью CSS

Автор: Николай Мурашкин 8.7.2008, 11:49

Здравствуйте!

Помогите, пожалуйста, разобраться в следующем вопросе:

Нужно расположить правильно три колонки (левая, центральная - текст, правая), сделанных с помощью div-вов. При этом нужно, чтобы в HTML-коде сначала шёл текст (центральная колонка), потом левая колонка, за ней - правая. А на странице отображалось так: левая - слева, текст - по центру, правая - справа.

Подробнее >>>

Код должен быть такой (т. е. колонка с текстом выше остальных):

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>  <head>      <title>Страница</title>  </head>
<body>

<div class="content">

<div class="text">Центральная колонка - текст</div>

<div class="left">Левая колонка</div>

<div class="right">Правая колонка</div>

</div>

</body>
</html>

А на странице должно отображаться так как обычно: текст - по центру, колонки - по бокам.

Использовал свойства CSS "float" и "clear", не получилось! Может не правильно использовал, а может что-то ещё нужно?

Автор: gid 8.7.2008, 17:01

Классический вариант сайта сделанного в 3 колонки - seo.su.
А если в двух словах, то там все организованно за счет абсолютного позиционирования (position: absolute;) и задания абсолютных позиций (left: 0px; и right: 0px;), при этом колонки имеют ширину выраженную в %. Средняя колонка находится посередине, т.к. ее искусственно "урезали" (margin: 0 25% 0 25%; ).

Автор: Николай Мурашкин 8.7.2008, 20:09

Ясно, спасибо!