Stack Overflow
Stack Overflow

Questions tagged [bem]

BEM is an abbreviation for Block-Element-Modifier. It's a convention for naming HTML DOM elements, CSS classes, JavaScript variables, and other web programming identifiers in a way that is easy to support and develop. It can be used for the individual development of a single website or for a large team working across multiple websites.

In some ways, BEM (bem.info, getbem.com) is similar to OOP. It's a way of describing reality in code, a range of patterns, and a way of thinking about program entities regardless of programming languages being used.

BEM principles are used to create a set of front-end development techniques and tools, that allows to build websites quickly and maintain them over a long time.

Learn more

436 questions
0
votes
1 answer

Less classes in html-markup with BEM

I try to get out all the chaining classes from my html-markup. Because then i have all my styles in my css file and i havn't to look inside my html to see how some elements were styled and the markup looks much cleaner... So instead of ...
Gregor Voinov
  • 2,203
  • 7
  • 34
  • 52
0
votes
1 answer

Elegantly targeting an element within a selector three nesting levels deep, without breaking linting rules

I am refactoring some SCSS, and I have come across a nesting issue using BEM syntax in my SCSS files. My linting rules state that I cannot use more than three levels of nesting. However, sometimes I may want to target an element within a modifier…
alanbuchanan
  • 3,993
  • 7
  • 41
  • 64
0
votes
2 answers

How to format html according to BEM naming concept?

I have the fooliwng code which is my approach to apply BEM naming to the project. But I guess something is wrong, because BEM states that elements of elemnts should not exist. How do I name them then?
…
boooni
  • 153
  • 1
  • 3
  • 9
0
votes
2 answers

BEM css - Mix elements/modifiers

I've a question about BEM structure. Is it semantically correct to mix elements/modifiers? I have a hero and portfolio module. I want to use an portfolio__item in the hero module, but it should use the base styling of the hero__item. Is this an…
John McGuinnes
  • 1
  • 2
0
votes
3 answers

BEM Naming Convention

I have just started to use BEM as my naming convention for classes and am starting to get to grips with it, but I have a question I would like to try and understand better. I have the following block...
Phil
  • 1,610
  • 4
  • 26
  • 40
0
votes
1 answer

How get root in Stylus?

I have problem with root nesting for better work with bem-modules in Sass we are use $root .block $root: & background: gray &__elem background: red color: black &:hover #{$root}__elem color: white this code compiled…
Eugene Balashov
  • 105
  • 1
  • 13
0
votes
1 answer

Conguring Hound.ci to work with BEM

I am using Hound CI as my code style cop, and BEM for my css naming, and Hound doesn't like BEM. How do you configure Hound to avoid commenting on BEM class names?
Jason Ramirez
  • 1
  • 2
0
votes
1 answer

Object Oriented CSS, BEM, and Expressive

Is using the BEM CSS naming methodology considered a form of Expressive CSS? Are either of them "Object Oriented CSS?"
noclist
  • 1,659
  • 2
  • 25
  • 66
0
votes
3 answers

Achieving true separation of concerns between HTML, CSS & JS?

Using the following HTML structure, how best do I achieve separation of concerns between HTML, CSS & JS?
0
votes
3 answers

Difficulties with scss BEM modifiers

I'm having a hard time understanding how to properly write scss with BEM naming conventions. Here I have some HTML:
text
Chirpizard
  • 291
  • 3
  • 17
0
votes
1 answer

BEM and inheriting properties of other classes

I'm running into a bit of an issue with BEM. I have the following:
  • Details
  • Conditions
    • ffxsam
    • 26,428
    • 32
    • 94
    • 144
0
votes
2 answers

How to deal with BEM in large modules?

I'm working on my first project using BEM. I'm loving it but there's just one thing I can't my head around: nesting solutions for larger modules. I have search a lot about this and there are many topics on stackoverflow, but the examples are all to…
albert105
  • 119
  • 1
  • 2
  • 8
0
votes
2 answers

Best way to write a subcomponent of a modified selector in BEM/SCSS

I want a nice elegant way in SCSS to write BEM subcomponents without being verbose, and modify them using the parent class. .container.container--red .container__title { } I tried this, but it didn't work: .container { &.container--red { …
David Ball
  • 553
  • 9
  • 19
0
votes
1 answer

Css bem block inside block naming

HTML layout
aboutjquery
  • 838
  • 2
  • 11
  • 22
0
votes
1 answer

BEM methodology, modifier and conflicts

For those who use BEM methodology to write CSS. I'm trying to learn BEM and I'm starting with a simple example, I have this: HTML
Andrés Orozco
  • 2,490
  • 5
  • 32
  • 48
1 2 3
…
29 30