Comments 36
Как хелп для напоминалки пойдет начинающим.
Вот только не понял что такое Каскадирование и специфичность, можете подсказать что почитать?
Простите, я чего то не понимаю или все-же контекстные селекторы работают по принципу дочерних?
Стиль для дочернего селектора применяется, когда он находится внутри родительского элемента, т.е. является прямым потомком. Стиль для контекстного селектора применяется на любом уровне вложенности. Вот, собственно, их различие.
«внешние полоски смежных элементов, имеющих hasLayout не сливаются»

Что такое внешние полоски?
2. Селекторы, псевдоклассы, псевдоэлементы

А почему бы уже сразу не скопипастить всю спецификацию?
А вообще, вся статья — «галопом по европам», никакой практической ценности от нее нет.
2) Ошибка с двойным маргином плавающих элементов:
Двойной маргин только с той стороны, в которую «плывет» блок.
Спасибо за уточнение. Действительно пропустил в материале.
Совершенно бесполезный материал, простой линк на спецификацию CSS поможет начинающему разработчику куда больше. Больше всего обескураживает куиркс-моуд. За каким чёртом в наше время его «полезно знать и помнить»? Его просто не должно быть, и точка.
Спецификация для новичка — это обязательное условие. По поводу quirks mode — я посчитал, что его упоминание уместно.
По поводу доктайпа — согласен. По поводу quirks mode — его появление в IE6, IE7. Можно, конечно, написать, что IE6, IE7 не должно быть — и точка, но браузеры-то существуют, и если с IE6 дело близко к развязке, то IE7 многие саппортят.
Куиркс-моуда не должно быть и в IE6/7, и его там никогда не будет при правильном доктайпе.
«его появление в IE6, IE7» — собственно и имелось ввиду появление при неправильном доктайпе либо его отсутствии
В общем, что я и говорил: «полезно знать и помнить» не о куиркс-моуде, а о доктайпе; причём не только из-за угрозы куиркс-моуда и IE6/7. Доктайп — это не какой-то необязательный трюк, включающий правильную обработку страницы, а декларация, обозначающая, на каком она языке. А о куиркс-моуде можно и нужно забыть. Лично я никогда с ним дела не имел и вовсе от этого не страдаю. Есть, конечно, тонкость с box-sizing, но о его связи с режимом совместимости в IE помнить тоже необязательно.
Проблема: в IE 6 у плавающих элементов создается двойной маргин.

а чего это еще актуально? IE6 разве не похоронили?
Он мертв уже давно, но похороны затянулись. Некоторые заказчики хотят иметь поддержку IE6 и их не смущают ни убеждения, ни доплаты за эту поддержку.
>Часть вопросов посвящена IE — сам отказался от поддержки IE6, однако знать особенности его поведения не будет лишним.

Я тоже подумал, что это шевеление трупа палкой. Уже и МС ему похороны организовали. Поменьше бы таких заказчиков.
От себя добавлю (не уверен что правильно, но, надеюсь, доступно =)):
Если внутри блочного элемента находятся относительно позиционированные блоки («float:left» например), то их высота не влияет на высоту родительского элемента. Иными словами, в контексте страницы родительский элемент не будет обрамлять дочерний.
Для того, что бы это исправить, родительскому элементу необходимо добавить свойство «overflow:hidden;».
А вот не надо в пособие для новичков вставлять вредные советы. Лучше использовать метод под названием «clearfix»:

.clearfix {
zoom: 1;
}
.clearfix:after {
content: '.';
clear: both;
display: block;
font-size: 0;
height: 0;
visibility: hidden;
}
Не знаю насколько он правильнее, но коротким его не назовёшь =)
В конце концов вёрсткой я профессионально не занимаюсь, поэтому наверное Вы всё таки правы.
Объясните только, пожалуйста, почему совет является «вредным»?
Не надо вредные комменты вставлять с IE-хаками :)
overflow: hidden/auto на родителe — валидный и описанный стандартами способ
Проблема overflow: hidden в том, что он может обрезать контент в некоторых ситуациях.

Raduzhka все правильно говорит, всегда нужно использовать clearfix.
Не в некоторых ситуациях, а когда жёстко заданы ширина и/или высота блока.
Не только. С ним гораздо больше проблем, чем вы думаете.

Например, иногда за пределы родителя нужно вынести какой-нибудь элемент. С overflow: hidden у родителя это невозможно.
К сожалению, во многих случаях clearFix даёт непонятные баги: растягивание строчки по высоте, добавление лишних пикселей и др. Иногда приходится пользоваться старым добрым :)
Присоединяюсь к совету, книга изумительная.
Кто то вверху хотел почитать о каскадности и специфичности, в книге все есть.
Не нашел ни строчки того, что давно не сохранилось в голове… Как-то для школьников всё.
А уж вертеть труп hasLayout'a — брррррр… Года 3 точно не видел необходимости в этом
Only those users with full accounts are able to leave comments. Log in, please.