Отображение таблицы в разных доктайпах

[Pinguin]

Есть у меня табличка с данными, а у таблицы декоративная рамка, где картинки порезаны на части и распределены между ячейками таблицы. Доктайп был loose, и всё выглядело замечательно.

Потом вдруг думаю - переделаю-ка на strict, делов-то. Поубирал все лишние параметры таблицы из html (border=0 align=center cellpadding=0 cellspacing=0), перенёс в стили. Откуда ни возьмись, появились промежутки между ячейками, и в рамке появились разрывы.

Задал в CSS для таблиц margin: 0; padding: 0; border-spacing: 0; - не помогло. Задал для строк - не помогло. Задал для ячеек - не помогло. Задал для картинок - тоже не помогло.

Что б ему ещё такое сказать, чтоб он понял?

[swetlana]

быть не может.

Где увидеть?

—-

кстати, о пользе обнуления стилей

Edited February 6, 2011 by swetlana

[klierik]

table { border-collapse: collapse; border-spacing: 0; }

[swetlana]

klierik, это же было моим первым ответом, но топикстартер говорит, что сделал так.

[sigma77]

Pinguin,

Картинкам display: block, либо в бекграунд их.

http://htmlbook.ru/blog/pochti-standartnyi-rezhim

[Pinguin]

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

Вот так это должно выглядеть: http://www.221b.ru/

А вот strict.dtd: http://www.221b.ru/index-strict.htm

Обратите внимание на разрывы в веточках и съехавший правый край бумаги.

[klierik]

фаербаг сказал что sigma77 прав.

выставь всем рисункам в таблице

[swetlana]

ну для начала в коде не нашлось border-collapse: collapse для таблицы.

Если его поставить, сделать display: block для картинок — всё встаёт на место.

Ну ещё правой картинке можно float: right или ячейке, в которой она живёт — text-align: right.

Но непонятно другое: для чего здесь вообще эта таблица?

Она же служит только одной цели: разбить на части рамку.

Но рамка эта неподвижна. Этот блок вообще абсолютно статичен.

На фоне же всё равно большая картинка (которая с изображением Вестминстерского замка).

Так почему б не объединить её с рамкой?

В разы меньше кода, меньше проблем, в несколько раз меньше запросов к серверу — и это при том же объёме передаваемых данных.

[Pinguin]

sigma77, klierik, увы.

ну для начала в коде не нашлось border-collapse: collapse для таблицы.

Если его поставить, сделать display: block для картинок — всё встаёт на место.

Не нашлось, потому что я уж раз 50 удалял, добавлял, снова удалял...

Неа, не встаёт. Прошу убедиться - залил заново.

На фоне же всё равно большая картинка. Так почему б не объединить её с рамкой?

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

[sava]

у себя использую такую конструкцию:

*{margin:0;padding:0}
table.bordered{border-collapse:collapse;}
table.bordered, table.bordered td, table.bordered th{border:1px solid black;}

и все работает

[Vlad]

Причина такого поведение здесь описано. Решение уже выше сказали.

http://htmlbook.ru/blog/pochti-standartnyi-rezhim

[Pinguin]

*{margin:0;padding:0}

Да, это спасло. Хотя, в "Самоучителе CSS" так делать не рекомендуется.

В целом же думается вот что: а ну его, этот strict...

Спасибо.

[Int]

Не рекомендуют что-то делать или не делать новичкам, которые не понимают сути действий или понимают её смутно. Профессионал же просто выбирает удобное для себя решение.