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
5
votes
1 answer

navigation using BEM

I'm trying to get my head around BEM, and I'm having troubles even with the most basic things. Such as a menu. Consider this code
fxck
  • 4,898
  • 8
  • 56
  • 94
5
votes
2 answers

BEM: the separation of blocks from layout

Let's say I have to define a header block in BEM. Headers need some indentation (padding, margins), but it's also a common understanding that layout should stay separated from components. The question is, should I specify indentation as a part of my…
user2587190
  • 59
  • 3
4
votes
5 answers

BEM: how to make sure rules of the right class (parent block) take precedence?

In BEM all selectors (classes) are supposed to have the same specificity. Meanwhile blocks are independent entities and you are supposed to be able to nest blocks in any combination and mix the class definitions of their elements. How do I make…
klm123
  • 12,105
  • 14
  • 57
  • 95
4
votes
1 answer

BEM. How to deal with label for/id?

As far as I know, BEM does not use elements id at all. But how to deal in this case with the label for/id combined with inputs? If I do not use id, people who're using screen readers will not get that this label is for that input. Am I right?
andrey.shedko
  • 3,128
  • 10
  • 61
  • 121
4
votes
1 answer

BEM, Cascading styles and Classitis?

I'm trying to return to front end coding for the web. The last time I tried write CSS was 10 years ago, and back in that time, there was a disease called classitis. My comprehension of classitis maybe wrong, but I took it as to not litter your…
John
  • 32,403
  • 80
  • 251
  • 422
4
votes
2 answers

Is it OK to apply multiple BEM elements to an html element's class?

I am structuring the CSS in my web application according to the BEM convention. I have a block called item and 3 elements: item__section, item__title and item__description. I am using these BEM classes as follows:
Chedy2149
  • 2,821
  • 4
  • 33
  • 56
4
votes
1 answer

CSS BEM child tag selectors?

Using CSS BEM methodology... Say I have some HTML, something like this (which is just example HTML made up for this question):

Text.

Text.

Text.

Text.

Text.

…
Stephen Last
  • 5,491
  • 9
  • 44
  • 85
4
votes
2 answers

BEM? Blocks inside blocks?

A little unsure on when to start a new context in BEM. Should all child elements always reference the block element? For e.g. bem …
Joe Consterdine
  • 1,035
  • 1
  • 18
  • 37
4
votes
2 answers

What is right BEM approach to global class inheritance?

I recently started using BEM methodology and I'm confused about class inheritance, or rather - when we talk about BEM - some use cases of modifiers. Let's look at this example, I have a simple element with few children .b-content { width: 100%;…
mdr
  • 421
  • 1
  • 6
  • 14
4
votes
1 answer

Using Bootstrap with itscss

Having seen BEM naming conventions. I would really like to use bootstrap sass with these methods. Is it possible to extend bootstrap to use BEM style class names? .block {} .block__element {} .block--modifier {} For example, how would I go about…
Bomber
  • 10,195
  • 24
  • 90
  • 167
4
votes
2 answers

BEM concept in CSS

I've recently played around BEM syntax, I am confused about BEM elements. I have header which contain logo and login box. So I made structure like this:
Jitender
  • 7,593
  • 30
  • 104
  • 210
4
votes
1 answer

Should module child elements be nested in module modifiers?

When writing css using BEM if you need to make changes to a module element when it is in a sub-module do you nest the module-element in the sub-module or create a new class name for the module-element? Creating a New Class Creating a new class…
hal
  • 4,845
  • 7
  • 34
  • 57
4
votes
2 answers

How use BEM correctly with Sass

I'm starting to use BEM methodology [BLOCK, ELEMENT, MODIFIER] and I have doubts about it. Inside a section called 'participate', I have a form, so:
4
votes
1 answer

How to choose among CSS modular methods like BEM, OOCSS, AMCSS, SMACSS, SUITCSS and others?

The is a lot of modular solutions for CSS. I listed some in the subject but probably there have been more already. How do you choose which one to use for your new project? Is there any comparison?
Varvara Stepanova
  • 3,489
  • 4
  • 22
  • 26
4
votes
1 answer

SASS @at-root with multiple parent selector

I've got a slight issue and searching hasn't yielded any results as of yet. But it is something that keeps appearing. I'm using SASS pre to work with the @at-root root so that I can do BEM CSS syntax. I've got the following…
Fernker
  • 2,238
  • 20
  • 31
1 2 3
…
29 30