Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> background - глюк в отрисовке, почему такой провал 
:(
    Опции темы
Иль
  Дата 23.1.2006, 12:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 544
Регистрация: 3.3.2005
Где: Москва

Репутация: нет
Всего: 14



Давно хотел спросить:
Код

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body style="margin:0; padding:0">

<div style="background:#f00;"><div style="background:#FFFF00; margin:100px;">123</div></div>
<div style="background:#f00; border:3px solid #000"><div style="background:#FFFF00; margin:100px;">123</div></div>

</body>
</html>


Ребят, почему без бордера background у первого div не отрисовывается? И самое главное как это объясняется стандартами?
Почему margin вложенного div без border у внешнего div "проваливается" как бы и применяется к внешнему div? Может так и должно быть по спецификации?


--------------------
Ты виндусятник?... А я да. smile
PM MAIL ICQ Skype GTalk   Вверх
Illuminaty
Дата 23.1.2006, 12:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56



Иль, у меня все нормально отображается
FF1.5, IE 6
Браузер у тебя какой?
PM MAIL ICQ   Вверх
Иль
Дата 23.1.2006, 13:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 544
Регистрация: 3.3.2005
Где: Москва

Репутация: нет
Всего: 14



У меня во всех браузерах строчки
Код

<div style="background:#f00;"><div style="background:#FFFF00; margin:100px;">123</div></div>

Код

<div style="background:#f00; border:3px solid #000"><div style="background:#FFFF00; margin:100px;">123</div></div>

выглядят по разному, причем как в CSS1 так и в Quirks режимах браузера (за исключением бордера в 3px конечно)
Браузеры IE6.0, Mozilla, FireFox, Opera 8.0/8.5/9.0
Вот так это выглядит у меня:
Ниже изображение (если оно не показываеся то то вот ссылка на HTML-страницу http://illvin.narod.ru/vyorstka/div.html )
user posted image

Это сообщение отредактировал(а) Иль - 23.1.2006, 13:55


--------------------
Ты виндусятник?... А я да. smile
PM MAIL ICQ Skype GTalk   Вверх
Illuminaty
Дата 23.1.2006, 13:22 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56



Иль, это я что-то сглупил...
У меня срабатывает только margin-left и margin-right (в варианте без bolder)
PM MAIL ICQ   Вверх
Иль
Дата 23.1.2006, 13:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 544
Регистрация: 3.3.2005
Где: Москва

Репутация: нет
Всего: 14



Illuminaty, спасибо что посмотрел smile .
Наверное так и должно быть. Сейчас пролистал стандарты - на вскидку не нашел почему так.
Расстраивает, что не понимаю почему так работает smile

Это сообщение отредактировал(а) Иль - 23.1.2006, 13:41


--------------------
Ты виндусятник?... А я да. smile
PM MAIL ICQ Skype GTalk   Вверх
Illuminaty
Дата 23.1.2006, 13:31 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56



а если написать так, то отображается как надо
Код

<div style="background:#f00; padding: 100px"><div style="background:#FFFF00;">123</div></div>

PM MAIL ICQ   Вверх
Иль
Дата 23.1.2006, 13:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 544
Регистрация: 3.3.2005
Где: Москва

Репутация: нет
Всего: 14



Illuminaty, спасибо, но я очень хочу понять помему mardin-top/bottom не работают. Про это и другие решения я знаю.
Почему вот блочная модель ведет себя именно так?



--------------------
Ты виндусятник?... А я да. smile
PM MAIL ICQ Skype GTalk   Вверх
Illuminaty
Дата 23.1.2006, 14:07 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56



Иль, посмотри пункт 8.3.1 Перекрывающиеся поля в CSS2 спецификации.
Особенно обрати внимание на слова
Цитата

которые не разделяются ни отступами, ни границами

Удачи


Это сообщение отредактировал(а) Illuminaty - 23.1.2006, 14:14
PM MAIL ICQ   Вверх
Иль
Дата 23.1.2006, 20:15 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 544
Регистрация: 3.3.2005
Где: Москва

Репутация: нет
Всего: 14



Спасибо, то что доктор прописал!
И к этому
Код

В CSS2 горизонтальные поля никогда не перекрываются.



--------------------
Ты виндусятник?... А я да. smile
PM MAIL ICQ Skype GTalk   Вверх
o.s.a.
Дата 24.1.2006, 09:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Xo4y B MocKBy
**


Профиль
Группа: Участник
Сообщений: 312
Регистрация: 16.2.2005
Где: Ташкент

Репутация: 3
Всего: 15



Что-то непонятно объяснено в спецификации, можно еще раз для "непонятливых" smile

Это сообщение отредактировал(а) o.s.a. - 24.1.2006, 09:39


--------------------
Не могу стоять, пока другие работают, пойду полежу.
PM MAIL ICQ   Вверх
Иль
Дата 24.1.2006, 20:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 544
Регистрация: 3.3.2005
Где: Москва

Репутация: нет
Всего: 14



Привет smile
Если нет паддинга или бордера, то марджины сложаться как у меня в первом div
Посмотри мою ссылку


--------------------
Ты виндусятник?... А я да. smile
PM MAIL ICQ Skype GTalk   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0806 ]   [ Использовано запросов: 20 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.