BEM：コンテナと行を持つ最良の方法は？

Question

I持ってBEMにおけるコンテンツブロックのための次のセットアップ：

SCSS

.container { 
    width: 960px; 
    margin: 0 auto; 
} 

.row { 
    width: 100%; 
    float: left; 
} 

.latest-news__container { 
    @extend .container; 
} 

.latest-news__row { 
    @extend .row; 
} 

にコンパイル：

.container, .latest-news__container { 
    width: 960px; 
    margin: 0 auto; 
} 

.row, .latest-news__row { 
    width: 100%; 
    float: left; 
} 

マイHTML

<div class="latest-news"> 
    <div class="latest-news__container"> 
    <div class="latest-news__row"> 
     <div class="latest-news__image"></div> 
     <div class="latest-news__content"></div> 
    </div> 
    </div> 
</div> 

質問： は、ブロック名あたりなどの要素のクラス名を維持するために.containerと.row良いアイデアのために@extend使用していますか？または、私はちょうど.containerと.rowを持っていますか？次に他のブロックのために別の@extendを持っていきます。

Answer 1

（異なるブロックまたは要素が同じDOMノード上で混在している場合）ミックスのコンセプトを見てみましょう：https://en.bem.info/methodology/key-concepts/#mixとhttps://en.bem.info/methodology/css/#mixes

をだからあなたのマークアップが全く@extendを避けるために、あなたの可能性を与えるであろう（このように見えるかもしれません）：

<div class="latest-news container"> 
    <div class="latest-news__item row"> 
    <div class="latest-news__image"></div> 
    <div class="latest-news__content"></div> 
    </div> 
</div>