Можно ли использовать один и тот же модификатор для блока и элемента?

Подскажите, пожалуйста, как правильно сверстать такие блоки:

Есть однотипные блоки, отличаются только взаимным расположением элементов, как в примере:

Я сделала для для каждого блока block модификатор - block_dir_row и block_dir_column. Проблема в том, что у некоторых элементов (.block__title) должны быть разные внешние отступы, в приложенном фидле - 2 и 20 пикселей. Согласно методологии, внешняя геометрия задается через родительский блок. Но родительский-то блок у них один и тот же. Я пока сделала так: задала им те же модификаторы, что и родителям, и через них сделала отступы (см. фидл). Правильно ли это?

7 years ago

tadatuta

В данном случае уместно использовать вложенные селекторы:

.block_dir_row .block__title {
    margin-bottom: 20px;
}

.block_dir_column .block__title {
    margin-bottom: 2px;
}

См. https://ru.bem.info/methodology/css/#%D0%92%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%BD%D1%8B%D0%B5-%D1%81%D0%B5%D0%BB%D0%B5%D0%BA%D1%82%D0%BE%D1%80%D1%8B

7 years ago

paulinekorkina

Большое спасибо! Действительно, в примере как раз мой случай.

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