Question about CSS architecture?

Question

css

Hello! There is SMACSS, OOCSS, Atomic and so on. Where you create parts, and blocks from parts, from page blocks. And it is implemented like this:

<aside class"sidebar push-left clearfix m-bottom-0"></aside>

More and more often I come across articles and opinions that it depends very much on the html structure, short-sighted, etc. What is better to do like this in css:

.sidebar {
 margin-bottom: 0;
 @extend %siderbar-base-style;
 @extend %clearfix;
}

What's better? When is one or the other better? What are your opinions?

Answer 1

Look at the example of this article on Habré . This is how I organize the system.

Answer 2

I am not a high-class specialist in this matter, but I tend to trust the opinion of people with extensive experience in the field and working on large projects with a complex structure, and they say that BEM is useful, but it is difficult to learn how to use it correctly, which is why haters (non-powerers) appear.