SpaceW
Постоялец
- Регистрация
- 27 Сен 2007
- Сообщения
- 96
- Реакции
- 45
- Автор темы
- #1
Меня всегда добивало поведение таблиц в разных браузерах и в очередной раз я начинаю волосы на себе рвать..
Вроде все просто, есть таблица:
И все бы хорошо, по замыслу в "контент" добавляется не ограниченное кол-во текста и картинок, при этом "новости"1,2,3 - остаются с фиксированной шириной и высотой, по идее изменять по высоте должна полько "полоса" и сам "контент". В реале: только Opera правильно реагирует, а вот IE и Мозила 3 - никак не хотят, они все растягиваю новости, причем на произвольную величину...
И сколько не искал, не смог найти нормальных пояснений..
Может кто-нибудь поможет разобраться?
А существет какой-нибудь сборник типа вопрос\ответ по таблицам в разных браузерах?
CSS, если нужен..
Вроде все просто, есть таблица:
HTML:
<table id="table_content" cellspacing="0">
<tr>
<td class="news00">новости 0</td>
<td rowspan="5" class="content_01">
контент
</td>
</tr>
<tr>
<td class="news01">
новости 1
</td>
</tr>
<tr>
<td class="news02">
новости2
</td>
</tr>
<tr>
<td class="news03">
новости3
</td>
</tr>
<tr>
<td class="polosa_01">
полоса
</td>
</tr>
</table>
И все бы хорошо, по замыслу в "контент" добавляется не ограниченное кол-во текста и картинок, при этом "новости"1,2,3 - остаются с фиксированной шириной и высотой, по идее изменять по высоте должна полько "полоса" и сам "контент". В реале: только Opera правильно реагирует, а вот IE и Мозила 3 - никак не хотят, они все растягиваю новости, причем на произвольную величину...
И сколько не искал, не смог найти нормальных пояснений..
Может кто-нибудь поможет разобраться?
А существет какой-нибудь сборник типа вопрос\ответ по таблицам в разных браузерах?
CSS, если нужен..
Код:
#table_content {
border-spacing: 0 0;
border-collapse: separate;
padding:0;
margin:0;
width: 1015px;
height: auto;
min-height: 596px;
}
.news00 {
width: 262px;
height: 22px;
background: url(images/news_00.gif) no-repeat center top;
}
.news01 {
width: 262px;
height: 197px;
background:url(images/news_01.gif) no-repeat center top;
}
.news02 {
width: 262px;
height: 197px;
background: url(images/news_02.gif) no-repeat center top;
}
.news03 {
width: 262px;
height: 179px;
background: url(images/news_03.gif) no-repeat center top;
}
.content_01 {
background:url(images/content_01.gif) repeat-y;
width: 753px;
min-height:596px;
height:auto;
}
.polosa_01 {
background: url(images/polosa_01.gif) repeat-y;
width:262px;
height: auto;
min-height: 1px;
}