Как по БЭМ сделать двум и более блокам разный отступ?

Question

[Yeni]

Не очень понимаю, как сделать разный отступ у двух элементов? Я понял как позиционировать блок если он один, через микс с элементом родителя:

<div class="some-parent">
    <div class="my-something some-parent__something">...</div>
</div>

Но что если блоков будет my-something будет больше? Например 3 и каждому будет требоваться разный margin? Как в таком случае лучше поступить, не городить же через модификатор что-то подобное, он ведь не про это?

<div class="some-parent">
    <div class="my-something my-something_offset1">...</div>
    <div class="my-something my-something_offset2">...</div>
    <div class="my-something my-something_offset3">...</div>
</div>

Или вот так будет нормально?

<div class="some-parent">
    <div class="my-something some-parent__something1">...</div>
    <div class="my-something some-parent__something2">...</div>
    <div class="my-something some-parent__something3">...</div>
</div>

Comments

[Михаил]

через утилитарные классы

Answer 1

[n1ksON]

Если все три элемента имеют разные отступы, то стоит их обернуть в разные блоки. И блокам задать отступы.

Comments

[Yeni]

Не могли бы вы пожалуйста продемонстрировать код такого решения?

[n1ksON]

Yeni,

<div class="some-parent1">
    <div class="my-something">...</div>
</div>
<div class="some-parent2">
    <div class="my-something">...</div>
</div>
<div class="some-parent3">
    <div class="my-something">...</div>
</div>

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

Добавлю, что по бему блок не должен ничего знать о своем положении. Отступы задаются через элемент родителя. Вот пример с бемом:

<div class='parent'>
  <div class="parent__item">
      <div class="my-something">...</div>
  </div>
  <div class="parent__item parent__item_ident-small">
      <div class="my-something">...</div>
  </div>
  <div class="parent__item parent__item_ident-large">
      <div class="my-something">...</div>
  </div>
</div>

[n1ksON]

Алекс Глебов, ай-яй-яй. В ответе я ошибся. Конечно же блокам нельзя задавать геометрию, но в нейминге нет ошибок. У меня корректно заданы названия классов элементам. Элементы пишутся через дефис.

[Yeni]

Спасибо всем, теперь все ясно.

Answer 2

[wyzemind]

Если my-something - это какой-то отдельный компонент, то можешь ему при необходимости добавить модификатор через нижнее подчёркивание. Не вижу проблемы.

Comments

[n1ksON]

В модификаторах описывается вид, а не геометрия.