X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Распределение высоты ячеек в таблице, Firefox 2
copy_hb
copy_hb
Topic Starter сообщение 2.12.2008, 15:56; Ответить: copy_hb
Сообщение #1


есть код:
<html>
<body>
<table width=100% height=100% border=1
cellpadding=0 cellspacing=0
>
<tr>
<td height=30%>30% height</td>
</tr><tr>
<td height=200px><u>200px height</u></td>
</tr><tr>
<td height=70%>70% height</td>
</tr>
</table>
</body>
</html>

результат -- на картинке в аттаче.
IE и Опера - ОК, а FF - жертвует нижней ячейкой в пользу верхних...
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Exterior
Exterior
сообщение 2.12.2008, 16:44; Ответить: Exterior
Сообщение #2


1) согласно стандартов, у table нет height; правильно задавать высоту нужно непосредственно в каждой ячейке или если уж сильно хочется, то хотя бы style="height:100%";
2) правильно <td height="200"> или <td style="height:200px;"> а не <td height=200px>
3) не указавая !DOCTYPE, браузер не будет проверять код на совместимость со стандартом, осюда разное поведение интерпретации кода.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
copy_hb
copy_hb
Topic Starter сообщение 2.12.2008, 18:25; Ответить: copy_hb
Сообщение #3


Ок. Вот код. Тот же результат.
Если знаете, как добиться результата как сейчас в IE и Opera, да еще и при strict.dtd -- помогите, научите.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<body>
<table style="width:100%; height:100%" border=1
cellpadding=0 cellspacing=0>
<tr>
<td style="height:30%">30% height</td>
</tr><tr>
<td style="height:200px"><u>200px height</u></td>
</tr><tr>
<td style="height:70%">70% height</td>
</tr>
</table>
</body>
</html>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Exterior
Exterior
сообщение 2.12.2008, 18:59; Ответить: Exterior
Сообщение #4


пожалуйста:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />

<title>test table</title>

<style type="text/css">
<!--
* {
margin: 0;
padding: 0;
}

html, body {
height: 100%;
}

table {
width: 100%;
height: 100%;
border: 0;
border-collapse: collapse;
}

td {
padding: 0;
}


--
>
</style>

</head>

<body>

<table border="1">
<tr>
<td style="height:30%;">30% height</td>
</tr>
<tr>
<td style="height:200px;">200px height</td>
</tr>
<tr>
<td style="height:70%;">70% height</td>
</tr>
</table>

</body>
</html>


заметьте, средняя ячейка 200px - выходит за рамки общей высоты в 100%, т.к. 1 и 2 ячейки высотой в 30% и 70% соответственно, что в сумме 100% общей высоты, поэтому IE к этим 100% прибавляет 200px средней ячейки; уменьшив, например, 1-й ячейки высоту до 20%, а 3-ю до 50-55%, тогда IE среднюю ячейку считает как за 25-30%.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
copy_hb
copy_hb
Topic Starter сообщение 2.12.2008, 22:22; Ответить: copy_hb
Сообщение #5


Exterior, спасибо за пример, жаль, приоритеты, как раз, стоят в обратном порядке, т.к. пользователей IE сейчас у меня ~65%, а остальные - Opera + FF. Т.е. корректное отображение в IE - must, а в FF - опция :(
А вообще, есть вариант табличной верстки под эти три браузера, чтоб средняя ячейка заданной высоты была, например, центрирована по вертикали, а верхняя и нижняя - заполняли оставшееся до 100% место, в пределе минимизируясь до 0?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Nightfly_hb
Nightfly_hb
сообщение 2.12.2008, 22:28; Ответить: Nightfly_hb
Сообщение #6


ну а выйдет IE8 финал - переделывать будете? имхо так нельзя...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
copy_hb
copy_hb
Topic Starter сообщение 2.12.2008, 22:31; Ответить: copy_hb
Сообщение #7


Sandman, а всех заставить перейти на IE8 или FF3 - можно? Решает не разработчик, а юзер.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Exterior
Exterior
сообщение 2.12.2008, 22:35; Ответить: Exterior
Сообщение #8


лично я такие вещи делаю на JavaScript - беспроигрышный вариант
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
copy_hb
copy_hb
Topic Starter сообщение 2.12.2008, 22:49; Ответить: copy_hb
Сообщение #9


Exterior, скорее всего, так и придется, а жаль =)
Кстати, в IE8 beta 2 все приведенные тут варианты работают =)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Exterior
Exterior
сообщение 2.12.2008, 23:05; Ответить: Exterior
Сообщение #10


(copy_hb @ 1.1.1970, 07:00)
Кстати, в IE8 beta 2 все приведенные тут варианты работают =)


приведенный мной вариант корректно работает, начиная с 4-й версии ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыСчетчики трекеров не отображаются в Mozilla Firefox
Самый глючный браузер наверное
26 muratastana 3660 13.12.2022, 8:36
автор: muratastana
Открытая тема (нет новых ответов) Составление семантического ядра+распределение слов по страницам+ТЗ копирайтеру
0 ya-qwefas 1563 1.2.2014, 18:29
автор: ya-qwefas
Открытая тема (нет новых ответов) Как переместить значения ячеек таблицы при клике на первую (Javascript, Ajax, jQuery)
2 anethum 6752 2.9.2013, 13:08
автор: -RayOfLight-
Открытая тема (нет новых ответов) Таблица растягивается в Chrome , Opera в FireFox все хорошо , помогите.
0 Hammer2900 6243 3.2.2013, 22:01
автор: -Hammer2900-
Открытая тема (нет новых ответов) Помогите сделать подсчет в таблице из из базы данных на сайте
2 Сергей климанов 3303 13.7.2012, 23:40
автор: -Сергей климанов-


 



RSS Текстовая версия Сейчас: 20.4.2024, 18:23
Дизайн