Why does BEM often use two underscores instead of one for modifiers?

Double Underscore is used to define sub element of a block. i.e: <nav class=”main-nav”> <a class=”main-nav__item” href=”#”>Text</a> </nav> Where main-nav is a block & main-nav__item is a sub element. This is done because some people might name their block like this main_nav which will create confusion with single underscore like this : main_nav_item Therefore double … Read more

BEM block, naming & nesting

There are a number of variants on how to write BEM classes, so be aware that are multiple competing standards. It started as a set of loose guidelines. Since posting this answer, Yandex has significantly overhauled their official standard (it’s quite an improvement). The version of BEM I use is based heavily from an article … Read more