ширина: наследовать и плавать: нет избыточности?

0

В учебнике для гибкого дизайна шаблон повторяется много раз:

@media screen and (max-width: 480px){
    .class1{
        width: inherit;
        float: none;
        }
    .class2{
        width: inherit;
        float: none;
        }

для двух двух классов, которые были установлены для float: left в родительском контейнере. Мне просто интересно: этот код лишний? Если для ширины задано inherit, нет никакого способа, чтобы какой-либо другой элемент плавал вокруг него, или я ничего не пропустил?

Редактировать Спасибо @BoltClock вот несколько примеров, где есть разница

Если дети находятся в блочном контексте, он не float: none; не обязательно:

http://jsfiddle.net/rCwnx/2/

В встроенном контексте float: left выглядит сломанным:

http://jsfiddle.net/TkJA7/

while float: none дает желаемый результат

http://jsfiddle.net/Z5RHX/

  • 1
    @André Андре Дион: Нет, часть «Inherited: no» просто означает, что она не наследуется по умолчанию. Вы все еще можете заставить его наследовать, используя ключевое слово « inherit .
  • 1
    От разметки HTML зависит и от других правил CSS, является ли настройка избыточной. В общем, это не так.
Теги:
responsive-design

1 ответ

1
Лучший ответ

Это не обязательно избыточно. Это полностью зависит от расположения поплавков и их контейнеров.

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

Внутри самого родительского элемента плавающий элемент выводит его из нормального потока, что также может вызвать нежелательные побочные эффекты для других элементов внутри родителя. Например, следующие братья и сестры в нормальном потоке будут располагаться так, как если бы этот элемент не был там, причем их текст начинался прямо под ним.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню