Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
what's your favorite CSS "trick"?

My favorite CSS "trick" would have to be these 3 lines of CSS:

* {
    background-color: rgba(0,255,0,0.1);
}

I've been using this snippet for years! It makes debugging layout a breeze and is quite insightful when dealing with the box model. What's happening here is that the * selector means "select every element on the page", and then we're giving all of those elements a slightly colored background color. This means that elements inside of each other will get darker. It also helps you understand how padding and margin are affecting elements surrounding each other. I prefer this technique as opposed to adding random borders and backgrounds to the elements I'm working on because this technique allows me to see my entire layout and element structure as a whole and how the elements play off each other. It's a simple, yet powerful "trick"!

Great trick. I learned something new. Thank you 👍

Woha this is useful!

Thanks !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment