HTML+CSS+JavaScript

Я почему-то решил, что верстать на таблицах - самое надёжное решение, наверно потому что они старше дивов.
Нашёл подходящий шаблон (с кучей разметки) и сделал на нём ряд страниц.
А потом обновил Оперу и...
Что, теперь всё выбрасывать?

Выбрасывать жалко, а в шаблоне, (когда я попробовал поковыряться наугад) ничего исправить не сумел.
Но неисправность в общем-то одна: в новой Опере и в IE та часть страницы, которая ниже шапки,
съезжает пикселей на 80 вправо. Остаётся слева слишком большое пустое поле.
Причём это происходит не у всех страниц. Что и создало у меня иллюзию надёжности (В начале-то я смотрел первые страницы в разных браузерах, а потом перестал,полагая, что внешний вид уже не будет меняться)

Мне бы узнать причину, почему так могут плавать таблицы, хотя бы сам принцип понять.
Тогда бы я не так наугад в этой разметке ковырялся, и, может быть сумел разобраться.

Если нет ошибки в коде разметки, то таблицы не плавают. Как-то так.
Пенять на "ненадежность" — преждевременно.
То, что таблица не уплывает в одном браузере или в двух, еще не означает, что ошибки в коде нет.

Так вот мой вопрос к этому и сводится: как же мне ошибку в коде выявлять? С какой стороны подойти и в каком браузере смотреть?

Если иначе спросить: От чего зависит надёжность табличной вёрстки?

Когда у меня таблица по каким-то причинам отображается не так как надо, я первым делом, для наглядности, делаю видимым border (вдруг дело не в таблице, а в позиционировании содержимого?), потом смотрю, не указан ли доктайп (из-за особенностей стандартов, например, параметр height игнорируется), потом открываю страницу разом во всех браузерах и начинаю играться выравниванием. А еще стараюсь держать код структурированным, с табуляцией в начале строк, чтобы проще было сирот ловить.
Самая любимая фишка - это забыть указать вертикальное выравнивание для <td>, когда при растягивании таблицы в некоторых браузерах содержимое остается наверху, а в некоторых ползет в середину по высоте.
Ну и да, объединенные ячейки не всегда ведут себя ожидаемым образом. Хотя с горизонтальным выравниванием я никогда проблем не встречал.
Надежность же верстки зависит от аккуратности и, как ни странно, следования стандарту. Валидный код при указанном доктайпе и с валидным же стилем в большинстве случаев не даст разногласий между отображением в разных браузерах.
Порой для закрепления непонятно-отчего-разъезжающейся ячейки приходится использовать прозрачный гиф 1х1.
ну вроде все вспомнил...

Большое спасибо за конкретные советы!
Теперь я знаю как отлаживать.
А то я растерялся просто из-за обёма форматирования.
Буду пробовать.

Верно.
Так всё и оказалось.
Простая проверка на валидность выявила ошибку.
Я видимо сам же её и создал неаккуратно выбрасывая из шаблона мелочи.
Так что извините, сам, так сказать виноват, а на зеркало бочку качу : )

Наугад вообще не надо ничего делать;)
В вашем случае табличный дизайн ненадёжен, только лишь по причине неправильного его использования (моё личное мнение, которое может не отражать действительность)
Скорее всего вы где-то неправильно указали параметры valign и align (или не указывали их вообще) и ещё при вёрстке таблицами желательно отказаться от colspan и ему подобных, а добиваться желаемого результата путём вложения таблиц друг в друга.

>при вёрстке таблицами желательно отказаться от colspan и ему подобных, а добиваться желаемого результата путём вложения таблиц друг в друга.

Это вы в точку! Там в шаблоне много colspan. А что именно за проблема возникает с colspan.

>Скорее всего вы где-то неправильно указали параметры valign и align (или не указывали их вообще)
Это подразумевает, что их всегда надо указывать, или всё-таки в каких-то конкретных случаях?
Особенно меня интересует align.
Так как по вертикали вроде нормально пока смотрится.

Не может быть таблице ненадежной, она может быть не верно оформлена. А вот недостаток таблицы - содержимое ее будет отображено тогда, когда будут загружены все ее элементы.

Если хотите контролировать на 100 % таблицы - пишите их сами , причем в редакторах которые не создают избыточный код - а только необходимую структуру типа

<table> <tr> <td></td> </tr> </table>

Ставьте border=1 и настраивайте размер и позиционирование самой таблицы так как хотите чтоб она выглядела в итоге. Когда настроили - заполняйте ячейки нужными данными, следя естесственно за размерами этих данных, чтоб они не были больше той ячейки в которую вставлены, иначе таблица разъедится.
Я вообще как определился с дизайном страницы, делю ее на отдельные части, которые будут независимы друг от друга, например таблица - шапка, таблица - основное содерджание, таблица - подвал. Помещать все в одну таблицу конечно не нужно, иначе пользователь увидит вашу страницу, только когда все ее содержимое загрузится.
DIV более продвинутый элемент чем таблица и желательно по возможности все же использовать его, т.к. управлять его отображением более удобно чем таблицей...

Спасибо за советы!
Но сам я могу много дней ковыряться с дизайном, так и не в состоянии на чём-то одном остановиться.
Можете посоветовать какой-нибудь сайт, где есть качественные шаблоны на дивах?
Особенно одноэкранные. На которых прокрутка не требуется.

http://www.mezzoblue.com/zengarden/alldesigns/

Какой бы ни был шаблон - все равно это шаблон, а шаблонный сайт это уже не индивидуальный сайт. Если здесь нет строгих требований то шаблоны в руки и вперед, иначе все нужно делать ручками.
Я делаю так :
1. Рисую страницу в графическом редакторе.
2. Членю ее на независимые блоки, которые будут лежать в корне, не влаживаясь в еще большие блоки.
3. верстаю эти блоки и позиционирую как требуется
4. Заполняю их более маленькими структурами, которые необходимы чтобы можно было правильно расположить все элементы в соответствии с выбранным дизайном
5 И так далее