размеры в процентах в Опере

[LEXiy]

Меньше слов, больше дела.
В прикрепленном примере HTML опера неправильно ставит размеры див блока.

Скажите свое авторитетное мнение на этот счет.

[studmar]

Браузеры (не только Opera) все правильно интерпретируют.
У Вашего блока div.content есть padding, который суммируется с width!

[LEXiy]

Спасибо за ответ. Действительно, если убрать паддинг ширина отображается правильно.
Странно, но ведь padding должен делать отступ внутрь и никаким образом не должен расширять размер блока наружу (по крайней мере положительный паддинг)
А почему высота таблицы увеличивается, ведь 100% должны рассчитываться от размеров ячейки.

[membrilius]

ширины DIVa расчитывается: width+pading+board ... если казать width=100% то это будет 100%+pading+board

[studmar]

Сообщение от LEXiy

Спасибо за ответ. Действительно, если убрать паддинг ширина отображается правильно. Странно, но ведь padding должен делать отступ внутрь и никаким образом не должен расширять размер блока наружу (по крайней мере положительный паддинг) А почему высота таблицы увеличивается, ведь 100% должны рассчитываться от размеров ячейки.

Мне стало интересно, и вот к чему пришел:
div по умолчанию блочный элемент, а следовательно задавать ему (в нашем случае это div.content) width нет необходимости. Если убрать width из CSS свойств то все становится на свои места.

Кстати, в CSS у нашего div прописано

padding: 10px 10px 10px 10px;

это можно написать короче

padding: 10px;

[LEXiy]

Ну да На счет паддинга 10px я знал, я так временно сделал.
А на счет width проблема действительно решается, но высота все-равно остается больше чем размер ячейки

[studmar]

Сообщение от LEXiy

Ну да На счет паддинга 10px я знал, я так временно сделал.
А на счет width проблема действительно решается, но высота все-равно остается больше чем размер ячейки

Поскольку в коде имеет место комбинирование div и элементов таблицы, то самое простое решение это задать отступ внутри ячейки td в 10px - это точно решит проблему.

И еще один момент, в коде какие-то свойства, относящиеся к таблице и ее элементам вынесены в css, например:

.leftclass{
	width: 200px;
	height: 100%;
}

а какие-то нет, например

<table class="maintable" CELLSPACING=0>

(а ведь еще существует и cellpadding и border)

Может будет полезным указать что есть вариант все это так же указать в css,
в нашем случае:

 
.maintable{
border:0px; /* border="0" */
border-collapse:collapse; /* cellspacing="0" */
}

.maintable td{
padding:0px; /* cellpadding="0" */
}

[LEXiy]

Сообщение от studmar

 
.maintable{
border:0px; /* border="0" */
border-collapse:collapse; /* cellspacing="0" */
}

.maintable td{
padding:0px; /* cellpadding="0" */
}

Ого как! Спасибо! Не знал.

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

[studmar]

Сообщение от LEXiy

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

Согласен, но ничего не поделаешь.
Еще один ньюанс: поскольку речь все же идет о "кроссбраузерности", то неплохо в начале документа указывать !DOCTYPE.
Зачем это надо делать - посмотрите статьи в сети)))
Сразу оговорюсь, что при указании !DOCTYPE должен перестанет работать height:100% для таблицы, вот пример.

[LEXiy]

в xhtml не существует понятия height для td, th, tr, table

Ну не идиотизм ли??? Таблицы всегда использовались для верстки в качестве средства позиционирования. Очень глупо (мягко говоря) было отключить height для них.
Хотя как ни странно у меня даже с !DOCTYPE таблица на весь экран, только вот контент по разному отображается