Для чего тут создается вспомогательный блок, чтобы отделить блоки (html)?

Question

[Денис Сопко]

Задача: Нужно блок с классом "list" отделить от блока с классом "block-portfolio" , то есть задать margin между ними.

Вопрос. Для чего здесь (на скриншоте) создают вспомогательный блок, в который ложится блок с классом "block-portfolio" и только этому вспомогательному блоку задают "margin-top: 30px"?
Почему нельзя было просто блоку с классом "block-portfolio" прописать в стилях "margin-top: 30px"?

Я знаю,что для блоков в БЭМ нельзя задавать размеры, но отступы-то можно... Или я что-то недоучил.

Comments

[Rustam Bainazarov]

Можно было.

[Денис Сопко]

Ankhena, то есть, не было бы ошибкой просто задать так, как я сказал? Просто я уже давно практикуюсь, учу верстку и не понял, почему именно так... Может я чего-то не знаю. Ведь чистоту кода это никак не испортит, если сделать так, как я предполагал

[Ankhena]

Денис Сопко, я пропустила слово БЭМ.

По БЭМу блокам нельзя задавать margin. Но вставка еще одного блока дело не решит.
Margin можно задавать элементам. Поэтому разумнее задать второй класс для .block-portfolio и сделать его элементом блока .wrap.
Возможно, вы сделали скрин в неудачный момент и .page-block-portfolio собирался стать не разделителем между списком и дивом, а как раз таки родительским блоком для .block-portfolio.

Answer 1

[Алекс Глебов]

Почему нельзя было просто блоку с классом "block-portfolio" прописать в стилях "margin-top: 30px"?

По бему блок не может знать о своем положении. Оно задается через элемент родительского блока .page__block-portfolio в который автор обернет сам блок.

Answer 2

[Макс]

Чтобы не прописывать кучу отступов для каждого блока, и изменить их одним махом у одного селектора.

Comments

[Денис Сопко]

Спасибо