Фоновое изображение для TR криво рендерится в Сафари?

Question

[ChemAli]

Задал фон для строк таблицы таким образом:

table tr {<br/>
 background: url(derevo.png) bottom repeat-x;<br/>
}

Фаерфокс, Опера показывают нормально, фон у строки таблицы монолитен:



А Сафари c Хромом рендерят фон отдельно для каждой ячейки таблицы, отчего становятся видимыми стыки:



Видимо, это связано с ленью разработчиков движков — ведь ряды таблиц визуализируются редко и есть

соблазн уростить себе задачу, позаботившись лишь о рендеринге ячеек. Беглый поиск по гуглю показал, что проблема застарелая и широко известна, даже IE этим переболел или по крайней мере может выживать с небольшим и валидным костыльком.


Это можно забороть штатно или лучше поискать хитрые и кривые решения?

Answer 1

[ChemAli]

Сам спросил — сам ответил: заставим ряды и ячейки таблицы забыть, что они должны вести себя как таблица.

tr {display: block;}
td {display: inline-block; background: transparent;}

И после небольших корректировок в размерах (ячейки свалились в кучу) все становится на свои места.

Comments

[ChemAli]

Это решение оказалось кривым — тут же привело к развалу таблицы в операх-фаерфоксах.

Answer 2

[Константин Китманов]

А если

table tbody { background: url(derevo.png) repeat-x repeat-y; }

?

Comments

[ChemAli]

У меня чередуются ряды разных типов с разными бекграундами, поэтому не очень подойдет. Хотя… если зафиксировать высоты, то… попробую. Спасибо за наводку, про tbody я забыл.

[ChemAli]

Проверил, рендерит также, как и для tr. Вот и медвед ниже подтверждает.

[Константин Китманов]

Облом:(

Answer 3

[Михаил Крайнов]

Такая же фигня возникает, если задать фон для tbody. В своё время так и не смог решить. Пришлось переделывать логику таблицы так, чтобы не использовать фон для tr и tbody.