Форум hotibo.ru

Tigger · 14.08.2011 16:58

Здравствуйте!
Нужно сверстать страницу как показано на макете:
http://mdmsymbol.ru/check/template.png
Саму страницу можно посмотреть тут: http://mdmsymbol.ru/check/
Сравните, как показывает страницу опера и как - IE.

Поясню: таблица, растянутая на 100% по высоте, 3 верхние строки и нижняя фиксированной высоты. 2 другие - поавающие, их высота зависит от контента, который будет в них (он будет меняться). На картинке голубым показаны границы ячеек таблицы.

Сначала верстала блоками (двумя способами), но из-за некоторых проблем блочной верстки, а также из-за сложности макета, пришлось выбрать табличную верстку. Есть варианты типа "как с помощью CSS приклеить футер к низу", но это все не подходит из-за дизайна страницы.

ПРОБЛЕМА заключается в том, что когда нет или мало контента, IE6 не понимает того, что фиксированные строки нужно оставить таковыми, а плавющие растянуть и растягивает ВСЕ строки, и все расползается. Причем, если в плавающих строках вообще ничего нет, то IE6 их сжимает до минимума, то есть в IE6 их совсем не видно. В опере, FF и сафари все работает как нужно.

Валидатор показывает, что на этой странице при данном доктайпе (XHTML 1.0 transitional) нет ни одной ошибки (эта редкая зеленая полоса! ).

Если вообще убрать доктайп, то все браузеры показывают как нужно. Но я интуитивно понимаю, что что-нибудь да будет работать неправильно, к тому же это не будет соответствовать стандартам. А хочется, чтобы страница была сверстана по стандартам!

Вот тут получается интересный факт: если все делать по стандартам, то работать не будет (утрированно, конечно). Я видила тут, что писали "IE не дружит с XHTML", но я также делала доктайп и HTML 4.01 - тот же результат.

Напрашивается вывод: зачем тогда вообще делали эти стандарты, если все равно приходится применять всевозможные хаки и извороты? И где они, эти стандарты, если валидатор показывает зеленую полосу, а браузер черт-те-что? o_O

И ГЛАВНОЕ: можно ли что-то сделать с этой страницей, чтобы реализовать растягивание только нужных строк по высоте? И как это сделать? Принимаются любые варианты верстки, лишь бы работало...

А может, в коде что-то не так?..

Прикожу упрощенный код страницы:

Код:

Тут иконки

Тут меню и лого

Тут должен быть весь контент - плавающая высота строки

Тут футер - плавающая высота строки

Отредактированно Tigger (14.08.2011 17:11)

alemiks · #2 14.08.2011 23:15

если используется rowspan, в ие невозможно установить точную высоту столбцов
p.s. а в css у вас есть свойства scrollbar-*, это конечно же по стандартам?

Tigger · #3 15.08.2011 14:49

Мммм... Спасибо большое! Хотя, я и без rowspan верстала, с одним плавающим полем - то же самое...

P.S. Это старый CSS, в новом такого нет. Но спасибо, что указали на это

Отредактированно Tigger (15.08.2011 14:49)

Mirkus · 27.08.2011 12:17

попробывал реализовать макет на картинке:

test

head

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

18
19
20
21
22
23
24
25
26
27
28
29
30
31

32
33
34
35
36
37
38
39
40
41

foot

Форум hotibo.ru

#1 14.08.2011 16:58

Таблица 100% по высоте, строки с фиксированной высотой и плавающей

Код:

#2 14.08.2011 23:15

Re: Таблица 100% по высоте, строки с фиксированной высотой и плавающей

#3 15.08.2011 14:49

Re: Таблица 100% по высоте, строки с фиксированной высотой и плавающей

#4 27.08.2011 12:17

Re: Таблица 100% по высоте, строки с фиксированной высотой и плавающей

Board footer