БЭМ — повторяющиеся блоки и элементы, что на счет дублирования свойств?

Question

iminby @iminby

БЭМ

БЭМ — повторяющиеся блоки и элементы, что на счет дублирования свойств?

Меня всё мучает один единственный вопрос, смысл бэма понятен.
По принципу элемент не может быть вне блока, вопрос такой, а если схожие свойства у меня, то по данной логике, нужно дублировать свойства?
То есть, есть у меня

block {}
 block__btn {}
 block_text {}

block1 {}
 block1__btn {}
 block1__text {}

что если у меня свойства будут одинаковый?
Дублировать всё?
По сути, даже подобная запись block__btn{}, block1__btn {}
Не подойдет, так как потом может измениться block1.

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

<div class="block">
 <div class="block__btn"></div>
 <div class="block__text"></div>
</div>

<div class="block1">
 <div class="block1__btn"></div>
 <div class="block__text"></div>
</div>

Только ответ пожалуйста русскими словами и без направления в гугл, там я уже и так прочитал.

Вопрос задан более трёх лет назад
2341 просмотр

2 комментария

Подписаться 2 Простой 2 комментария

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

А в html коде у вас вероятно ошибка, там где .block__text внутри .block1.
если что то где-то дублируется, возможно нужно вынести это в отдельный блок

Answer 1 · 2018-12-29 02:43:57

Меня всё мучает один единственный вопрос, смысл бэма понятен.

Точно понятен? Смысл как раз избегать дублей.

если элементы по свойствам одинаковые, но в разных блоках.

То из этих элементов нужно сделать блок, будет примерно так:

<div class="block">
 <div class="btn block__btn"></div>
 <div class="text block__text"></div>
</div>

<div class="block1">
 <div class="btn block1__btn"></div>
 <div class="text block1__text"></div>
</div>

БЭМ — повторяющиеся блоки и элементы, что на счет дублирования свойств?

Войдите на сайт