DEV Community

Discussion on: Tell me about the worst CSS you've ever had to deal with

Collapse
lukeshiru profile image
LUKESHIRU

One for a popular marketplace that I can't mention, but let's say if I had to make a movie about it, it would be called: "CSS: The !important Wars" 🤣

Collapse
achimoraites profile image
Achilles Moraites

The horror when you realize that people begin adding inline css rules with !important...

Collapse
kawhyte profile image
Kenny Whyte

"CSS: The !important Wars"

This would be great on a t-shirt.🤣

Collapse
dansilcox profile image
Dan Silcox

The sequel will be “CSS: the z-index strikes back” 😂

Thread Thread
mateus_vahl profile image
Mateus Vahl

Yup! Since I had this issue, I now follow this global variable approach:

$z-index: (
  menu: 10,
  offcanvas: 20,
  lightbox: 30
);


@mixin z-index($key) {
  z-index: map-get($z-index, $key);
}

Everything on the page that could overlap is defined above.