0

Does this code violate the BEM specification or is it a "mix?

<button class="corp-info__button-read-more button">Read More</button>

It's the class button that interests me.

GeKtoRiX
  • 31
  • 1
  • 4

1 Answers1

0

In principle it's not a problem. However:

You might want to place the button class (it seems to define the more general styles) first and corp-info__button-read-more second (seem to represent the more specific styles).

Always order bem classes from general to specific in your class attribute.

Also maybe you want (although it's advice you didn't ask for) to distinguish between corp-info__button and a respective modifier corp-info__button--read-more.

In orthodox BEM a single dash has no semantic meaning, therefore --read-more is simply a modifier name.

LongHike
  • 4,016
  • 4
  • 37
  • 76
  • Thank you for your answer. I'm about making my first site by BEM spec and sometimes not sure how to position some classes. And your extra advice will help me to structure class trees more wisely. – GeKtoRiX Jul 21 '21 at 09:36
  • This was a nice question too, which reflects the BEM idea nicely: https://stackoverflow.com/questions/15294322/confusion-with-bem-class-naming-convention-one-level-deeper – LongHike Jul 21 '21 at 09:45