BEM: the separation of blocks from layout

Question

Let's say I have to define a header block in BEM. Headers need some indentation (padding, margins), but it's also a common understanding that layout should stay separated from components.

The question is, should I specify indentation as a part of my header block CSS, or should it only be provided by surrounding blocks (layout blocks or grid)? Both approaches have their cons and pros.

So what are, in your opinion, the pros and cons? – Alohci Jul 16 '13 at 12:17 — Alohci, Jul 16 '13 at 12:17

score 2 · Answer 1 · answered Jul 16 '13 at 16:08

2

You can mix few blocks (or block and element of some other block) on the same DOM-node.

E.g. <div class="header layout__header">.

answered Jul 16 '13 at 16:08

tadatuta

2,007
11
12

I used such a method in my blog http://varya.me/. You can see in the source the 'island' block, not pure layout but somehow responsible for that. Then, its elements can be mixed with other blocks.
...
– Varvara Stepanova Jul 16 '13 at 16:27

score 0 · Answer 2 · answered Jul 16 '13 at 12:12

0

it will be better if you specify indentation to header block, because you will need less work to do and will maintain consistency.

answered Jul 16 '13 at 12:12

Manoj Meena

244
1
5

BEM: the separation of blocks from layout

2 Answers2