Explorer+Opera+Firefoks=:shok:

Цитата:

Чувствуется, что в данном вопросе вы не рубите

Ну, про мои способности судить не вам; а ссылки кидать не стоило - google'ом пользоваться я еще не разучился для таких случаев... А вот то, что в Opera 8.5 у меня квадрат 100x100 - это факт... Могу даже скрин показать. Хотя в этом отпадет необходимость после уточнения: 120x120 будет во всех браузерах тогда, когда указан стандарт xHTML 1.0 для страницы. Если же использовать HTML 4.01, то будет этот баг.
PS: Только не надо заводить речь о том, что HTML 4.01 сегодня устаревает и надо юзать xHTML 1.0...

Цитата ("-Miracle-Flash-"):

Я тут тему завела не для бесполезного критикования друг друга, а для того, чтобы разобраться в вопросе. Так что давайте по существу.<_<

Прочитайте внимательнее - я не критикую, тем более "бесполезно". А описываю конкретные правила для CSS. Думаю, вам тоже будет полезно в них разобраться, тем более что aats говорит странные вещи про блочную модель.

aats, видите ли, никакого xHTML 1.0 для страницы я не указывала при проверке вашего кода. Именно тот самый HTML 4.01, про который никто и не собирается заводить речь об устаревании.
Проверьте ваш пример в разных броузерах еще разок. Поставьте padding:40px
Жаль, не могу проверить лично по 8.5 Опере.
Но то, что в IE6, Firefox 1.5 и в Опере 9 ширина всех квардартов равна width+padding при стандарте HTML 4.01 - факт.

ссылка - вот подтверждение моих слов (извиняйте, нотариально не заверено - лень идти было )... Можете, конечно, сколько угодно говорить, мол, подрисовал, но факт есть факт - бага есть... Как еще доказать - не знаю...

aats, То есть имеем: стандарт CSS "ширина контейнера = width + padding +margin"

- IE выше 5-й версии его поддерживает (вопреки вашим словам)
- Firefox всегда это поддерживал и поддерживает
- Mozilla - судя по вашему посту таки она поддерживает
- Opera 9 - поддерживает.
- Opera 8/5 - не поддерживает, судя по вашему посту.

То есть баг не в Mozilla, как вы утверждали изначально, а в Опере 8.5, а Mozilla как раз согласно стандарту код обрабатывает.

Впрочем, есть хороший способ избегать проблем с различным отображением блочной модели: не ставить фиксированную width тем блокам, для которых нужно установить padding и margin, отличным от нуля. Поэтому у меня лично таких проблем не возникает.

Вот вам еще скрин для IE: ссылка
PS: там стоит увеличенный шрифт, но это роли не играет...

Цитата:

не ставить фиксированную width тем блокам, для которых нужно установить padding и margin, отличным от нуля.

Ну, не обязательно... Можно указать ширину для блока, а текст просто взять в <p>, указав аналогичный margin.

aats,
это уже становится смешно.
ну, почитайте где-нибудь на спец ресурсах о том, как ИЕ какой версии блочную модель отображает.
В итоге, повторю, имеем:
стандарт CSS "ширина контейнера = width + padding +margin"

- IE выше 5-й версии его поддерживает (вопреки вашим словам)
- Firefox всегда это поддерживал и поддерживает
- Mozilla - судя по вашему посту таки она поддерживает
- Opera 9 - поддерживает.
- Opera 8/5 - не поддерживает, судя по вашему посту.

То есть баг не в Mozilla, как вы утверждали изначально, а в Опере 8.5, а Mozilla как раз согласно стандарту код обрабатывает.

Цитата:

То есть баг не в Mozilla, как вы утверждали изначально, а в Опере 8.5, а Mozilla как раз согласно стандарту код обрабатывает.

Как бы там ни было, но баг есть... Кстати, проверил на другом компе на тех же Opera 8.5 и IE6 - результат: 100x100... Так что... что-то тут не так - нужны еще тестеры.

IE 6.0, Mozilla Firefox 2.0, Opera 8.5.

В Firefox - 120 px, в IE и Opera по 100. Как и говорил aats, в первом посте по этому поводу.
насколько я знаю padding влияет на величину отступа текста от краев контейнера, но никак не на размер самого контейнера.

-Miracle-Flash-, я плакал....
aats, не "тестеры" нужны, а понимание, почему что и как.
ФФФсе, люди, разбирайтесь сами.

letayushaya, собственно, причину нашел... Баг проявляется, если не указать "http://www.w3.org/TR/html4/loose.dtd". Как ни странно, но проверка на валидность не ругается на отсутствие этого куска, следовательно, его можно не уазывать... -_-

letayushaya,
причем здесь border: 20px?
Вы то смеетесь, то плачете, без истерик нельзя ответить?

aats, указываю "http://www.w3.org/TR/html4/loose.dtd" и все равно в Firefox_е - 120 px, а в остальных - 100.
И я до сих пор не понимаю как у letayushaya, padding приплюсовывается к width.

-Miracle-Flash-, для наглядности. Реакция на то, что люди в большинстве случаев составляют мнение о верстке, не прочитав толком элементарных правил. Не обижайтесь, но ваши суждения это подтверждают. Учитесь. Наберите в поисковике "блочная модель" и прочитайте, на что и как влияют margin, padding, border.

aats, то есть Опера 8.5 при указании "http://www.w3.org/TR/html4/loose.dtd" все правильно показывает? Ну, слава богу, я в этом была уверена. А DOCTYPE лучше всегда полностью и правильно указывать - меньше проблем с визуальным отображением будет... как мы все тут уже поняли.

letayushaya, кстати, еще раз - я этот топик создала как раз для того, чтобы учиться. но не думайте, что вы меня чему-то научили.

-Miracle-Flash-, если написать так:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

	<title>Тест</title>

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

</head>

<body>

	<div style="height: 100px; width: 100px; padding: 10px; background-color: #000; color: #fff;">Текст</div>

</body>

</html>

, то проблем быть не должно...

letayushaya, почитайте здесь про padding - ссылка

aats, так и писала

-Miracle-Flash-, учится человек всегда сам. Да и я на роль учителя не претендую. Я всего лишь советую вам скрупулезно перелопатить спец. ресурсы по CSS.
Кстати, если бы внимательно читали, то уже бы поняли, откуда паддинги суммируются к ширине:
стандарт CSS "ширина контейнера = width + padding + margin"
И именно про это и говорится в описании блочной модели.