Bonjour à tous,
Je suis en train d'essayer de mettre en place la convention BEM (Blocks - Elements - Modifier) dans mon entreprise afin d'uniformiser le CSS de nos projets.
Vu que je ne connais pas bien cette convention j'ai une question qui peux paraitre bête mais dont j'aimerai avoir l'avis de ceux qui utilisent BEM :
Lorsque j'ai un block, dans un autre block, etc... sur plusieurs niveaux, comment ça se passe ?
Exemple : J'ai un header, cet header contient un menu, ce menu contient des items, ces items contiennent une image et un span.
Est-ce que les éléments de mon item doivent être nommés comme ceci :
.header-menu-item__image et .header-menu-item__span ? Ou ai-je mal compris ?
De plus, au cas ou je sois sur l'item actif de mon menu, est ce que chaque élément de mon item doit avoir le modifier : .header-menu-item__image--active et .header-menu-item__span--active ?
Merci d'avance pour vos éclaircissements
Je suis en train d'essayer de mettre en place la convention BEM (Blocks - Elements - Modifier) dans mon entreprise afin d'uniformiser le CSS de nos projets.
Vu que je ne connais pas bien cette convention j'ai une question qui peux paraitre bête mais dont j'aimerai avoir l'avis de ceux qui utilisent BEM :
Lorsque j'ai un block, dans un autre block, etc... sur plusieurs niveaux, comment ça se passe ?
Exemple : J'ai un header, cet header contient un menu, ce menu contient des items, ces items contiennent une image et un span.
Est-ce que les éléments de mon item doivent être nommés comme ceci :
.header-menu-item__image et .header-menu-item__span ? Ou ai-je mal compris ?
De plus, au cas ou je sois sur l'item actif de mon menu, est ce que chaque élément de mon item doit avoir le modifier : .header-menu-item__image--active et .header-menu-item__span--active ?
Merci d'avance pour vos éclaircissements