Here is our own reset CSS based on a few other ones.

The snippet is long so you need to read more to see it.

When needing a pseudo element overlay you will need before or after. Then in some cases you still want the text from the parent element below to show.

The trick is to use z-index like below. To make it work, you also need to set position: relative;.

div {
  position: relative;
  z-index: 1;
}

div:after {
  z-index: -1;
}

When making an image gallery it can be nice to enlarge the image on hover. Try to hover the images below.

I've noticed that transition animations sometimes are slow in some browsers. In that case, it can be a better experience for the user to simply disable the animation.

Here is how it's done.

div {
  transition: transform 200ms ease-in;
}

Webkit (Chrome)

-webkit-transition: none !important;

Firefox

  -moz-transition: none !important;

Opera

  -o-transition: none !important;

Internet Explorer

  -ms-transition: none !important;