У меня есть таблица, в которой у меня есть это
</tr>
<tr class="table-top-background" >
<td class="thread-pic" ></td>
<td class="thread-top-middle" colspan="2" >Threads</td>
<td class="thread-information">Last Post</td>
</tr>
Так что я хочу дать фоновое изображение для моего tr, поэтому я поставил это
.table-top-background
{
background:url('/img/design/extra-large-back.png') no-repeat;
position:relative;
color:White;
height:31px;
}
.thread-pic
{
width:30px;
}
.thread-information
{
width:280px;
}
.thread-top-middle
{
width:418px;
}
Проблема в том, что ввсе браузеры это нормально ожидать Google Chrome.В Google Chrome кажется, что я даю фон не для tr, а для всех тд ... Он повторяет один и тот же фон для каждого тд.
То же самое в IE7, но в одном из вопросов stackoverflow, о котором я читалрешить это с position:relative
, и это помогло.Но я не нашел солютуина для Chrome.Я пытаюсь дать tr css, как это также
.table-top-background
{
background:url('/img/design/extra-large-back.png') no-repeat 0% 100%;
display:block;
position:relative;
color:White;
height:31px;
width:728px;
}
Но это меняет весь дизайн моей таблицы ... В то время текст в td этой строки заголовка находится не в этих местах, а также allдругие первые td моей таблицы имеют тот же размер, что и мой заголовок tr .Это кажется действительно смешным.
Я также пытался дать display:inline-table
вместо display:block
, и это мне тоже не помогло ... Каково решение этой проблемы?
РЕДАКТИРОВАТЬ: Та же проблема в Safari, так что это проблема webkit.