Can BEM methodology be effectively used with CSS frameworks like Bootstrap? Which markup structure is better suited for this purpose:
<div class="hero">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto">
<h1 class="hero__title"></h1>
</div>
</div>
</div>
</div>
or should the document be structured like this:
<div class="hero">
<div class="hero__container">
<div class="hero__row">
<div class="hero__row-inner">
<h1 class="hero__title"></h1>
</div>
</div>
</div>
</div>