DEV Community

Calin Baenen
Calin Baenen

Posted on

How can I style an element based on multiple factors in CSS?

Is it possible to style an element if it's tag is elementtag and has the class myclass.
Consider this pseudo-CSS:

button & .specialButton {
    /* Add special button styling here. */
}
Enter fullscreen mode Exit fullscreen mode

Top comments (3)

Collapse
 
moopet profile image
Ben Sinclair

I may be misunderstanding, but this would do what you want: button.specialButton.

Collapse
 
baenencalin profile image
Calin Baenen

But doesn't that only work if the item with .specialButton is inside of a button element (without the requirement for element to be a button)?
Or is it whitespace sensitive (i.e. button.specialButton != button .specialButton)?

Collapse
 
moopet profile image
Ben Sinclair

It's whitespace that's important:

  • button.specialButton - a button with the class specialButton
  • button .specialButton - any element with the class specialButton that's anywhere inside a button.
  • button#verySpecialButton - a button with the id verySpecialButton
  • button #verySpecialButton - any element with the id button that's anywhere inside a button.