Как правильно задавать расположение и размеры блоков?

Добрый день! Начал изучать БЭМ и возникли вопросы. Есть такая разметка

<div class='b-container__part1'> элемент места для блока
    <div class='b-slider'> блок
        <div class='b-slider__text'> элемент места для блока text
            <div class='b-text'> блок с текстом
    <div class='b-slider__img'> элемент места для блока img
        <div class='b-img'> блок с изображением

Нужно задать размеры и расположение блоков текста и изображения. Эти параметры нужно применять к элементу места или непосредственно к блоку?

9 years ago

tadatuta

Проверить себя просто: в идеале блоки должны быть реализованы так, чтобы их можно было переиспользовать в другом месте. Поэтому логично, когда за лейаут отвечают элементы родительского блока (не обязательно это должны быть теги-обертки, можно использовать миксы).

9 years ago

4ok

+1.

В идеале каждый блок ничего не должен знать о своем местоположении, т.е если сказать просто, у него не должно быть никаких margin, top, left и т.п. За его расположение должен отвечать контейнер внутри которого он размещается, зачастую этот контейнер можно смиксовать с самим блоком. Меньше думайте как верстальщик, больше думайте как архитектор.

Зачастую лень создавать еще одну сущность контейнер для правильного расположеения в нем блока, проще прописать стили для самого блока, но поверьте в будущем, при развити и изменении проекта вам это скажется не в лучшем свете.

Примеры:

так НЕ желательно:

<div class="block-1-style-and-it-position"></div>

Лучше так:

<div class="block-1-style element-of-block-2-for-set-position-to-block-1"></div>

Ну в крайнем случае так, если второй вариант не подходит по каким-то причинам:

<div class="element-of-block-2-for-set-position-to-block-1">
    <div class="block-1-style"></div>
</div>

Вообщем тут вариантов много, думаю что для понимания, того, что я хотел донести, хватает.

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