Что именно представляет собой «внешняя геометрия» в методологии БЭМ? ⇐ Html

[Anonymous]

Я изучаю методологию БЭМ и столкнулся с этим принципом в документации:

"Блок не должен влиять на его окружение, то есть вы не должны устанавливать внешнюю геометрию (поля) или позиционирование блока".

Мне нужно уточнить, какие свойства CSS окончательно считаются "внешней геометрией" и как решать практические проблемы макета.
Конкретные вопросы:

• Какие свойства CSS определенно являются «внешней геометрией»?
  • Ограничен ли список следующими параметрами: поля, позиции, сверху/слева/справа/снизу, float, z-index?
  • А как насчет ширины и высоты? Они кажутся контекстно-зависимыми.
• Как обрабатывать внутреннюю компоновку без внешней геометрии?
  • Если блоки не могут иметь ширину, как предотвратить нарушение макета внутренними элементами с фиксированной/процентной шириной?
  • Пример сценарий:

Код: Выделить всё

.card {
/* No width set - following BEM principle */
}
.card__image {
width: 100px; /* Could overflow if .card is too narrow */
}
.card__content {
width: 80%; /* Percentage of undefined container */
}

• Являются ли эти альтернативы приемлемыми?
  • Использование минимальной ширины/

    Код: Выделить всё

    max-width

    вместо ширины
  • Использование отображения: flex/grid на блоках
  • Использование элементов-оболочек для управления макетом

Что я пробовал/исследовал:

• Прочтите документацию по БЭМ и краткое руководство
• Изучили примеры, но обнаружили несоответствия в реальном использовании
• Понимаем философию многократно используемых компонентов, но нуждаемся в практическом руководстве по реализации

Где следует провести границу между «влияние на окружающую среду» и «поддержание внутренней структуры» на практике?

Подробнее здесь: https://stackoverflow.com/questions/798 ... ethodology