Центровка сайта: проблема в Opera

[rounder]

Делаю отцентрованный сайт (Ссылка, narod.ru, исходник на slil.ru), :

<table>

<td></td>

<td>изображение с фиксированным размером</td>

<td></td>

</table>

Всё получается ок, центральная колонка и изображением остаётся ровно в центре, никаких проблем.

Однако, к таблице приходится добавлять

cellspacing="0" cellpadding="0"

Чтобы не было зазоров/границ. После этого исключительно в Opera всё это дело слезает:

Думал, конечно, жёстко задать ширину левого и правого <td> в процентах/пикселях, но тогда они потеряют свою "резиновость".

Как решить проблему? Спасибо.

Edited March 8, 2010 by rounder

[Sh.B.Malinkin]

Во-первых, советую изначально избавиться от ошибок в коде id может встречаться только 1 раз на странице, если надо больше, используйте class. Непонятные закрывающие теги после </html> - подарок яндекса, надо пологать...

На счет Вашей проблемы: А не проще выровнять таблицу маргинами? Посмотрите тут: http://www.htmlbook.ru/css/margin.html

[rounder]

Sh.B.Malinkin

Спасибо, ошибки исправил.

А не проще выровнять таблицу маргинами?

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

Соответственно, боковые <td> мне понадобятся, чтобы туда эту заливку разместить. Я бы просто сделал <width=15%> боковым <td>, но мне нужен фиксированный размер центральной колонки (идентичные размеру центрального изображения). Пример желаемого:

Edited March 8, 2010 by rounder

[Int]

body

{

background-image:url('zalivka.png');

background-repeat:repeat-x;

}

table.main

{

margin:0 auto;

width:1024px;

}

так что ли?

Единственный косяк - на примере не совсем repeat-x, там надо ещё один слой нагородить сзади.

Edited March 8, 2010 by Int

[Sh.B.Malinkin]

Единственный косяк - на примере не совсем repeat-x, там надо ещё один слой нагородить сзади.

Ну как-то в td фон влазит? Точно так же вешаем его на bogy, таблицу- маргинами, как написал Int.

[Int]

Там два разных фона зеркальных, не влезут они в боди

[Sh.B.Malinkin]

исключительно в Opera всё это дело слезает:

И, кстати переходя по Вашей ссылке, в Firefox 3.6; IE6 (у меня) слезает тоже...

Выглядит как на второй фотке.

только в добавок и горизонтальные полосы обрезаются...

Edited March 8, 2010 by Sh.B.Malinkin

[Sh.B.Malinkin]

Хм, мне даже стало интересно, rounder, можете скинуть мне на мыло исходный код с картинками, попробуем сделать (если хотите, конечно ).

[rounder]

Sh.B.Malinkin

И, кстати переходя по Вашей ссылке, в Firefox 3.6; IE6 (у меня) слезает тоже...

Выглядит как на второй фотке.

Я, к сожалению, не тот css файл залил. Сейчас поправил, "проблема" отображается как надо.

Исходник slil.ru. Выложил бы сюда исходники, если б была функция спойлера.

Int

Спасибо за пример. Я в принципе тоже думаю как вариант сделать по центру таблицу с "margin: 0 auto;", чтобы она плавно вливалась в фон, а фон уже задать в body просто цветом.

Edited March 8, 2010 by rounder

[DjTarik]

Таблицы тут вообще ни к чему... Всё делается на дивах на раз-два. В вашем случае фон вообще можно сделать одной картинкой и повесить на body или html

[rounder]

DjTarik

Я, к сожалению, туповат пока для блочной вёрстки. Если вас не затруднит объяснить по-подробней.

Но идею повесить фон на бэкграунд, а остальное центрованной таблицей, думаю буду брать для варианта с границами.

В общем, в варианте с границами,

отлично работает вариант, предоставленный Int. Спасибо!

Остаётся выяснить, как быть с изначальным вариантом, когда сайт тянется до краёв экрана.

Просто отцентровать единственную таблицу не получится - элементы сайта должны доходить ровно до краёв экрана, поэтому я и начал изначально мучиться с <td>.

Вот пример подобного устройства сайта, что я пытаюсь достичь.

Edited March 8, 2010 by rounder

[rounder]

Исходную проблему решил добавлением в css двум боковым <td> ширины в 1 пиксель, после чего сайт перестал коллапситься в Опере.

В итоге, правда, сверстал всё на div-ах, как и предлагал DjTarik, действительно гораздо проще в условиях примитивной структуры шаблона.

Спасибо, ребят, что натолкнули меня.

Edited March 9, 2010 by rounder