See the page structure with an handy CSS Debugging snippet

Nicola Greco — Fri, 20 Nov 2009 22:49:12 +0000

Non pubblico in genere codice su questo blog, che è più un diario personale che il mio blog tecnico. Ho trovato su internet questo snippet che credo potrebbe essere utile anche ad altri sviluppatori, anche se personalmente quando uso firebug, non ho bisogno di questo debugger “fatto in casa”.

I don’t use to post about code, but I found on internet a clever snippet to see the page structure, useful if you’re a css coder and you need to debug css code.

* { outline: 2px dotted red }
* * { outline: 2px dotted green }
* * * { outline: 2px dotted orange }
* * * * { outline: 2px dotted blue }
* * * * * { outline: 1px solid red }
* * * * * * { outline: 1px solid green }
* * * * * * * { outline: 1px solid orange }
* * * * * * * * { outline: 1px solid blue }

I personally use Firebug, but this old post was very interesting.

This is what you should see using these lines to debug this theme css.

Nicola Greco » css

See the page structure with an handy CSS Debugging snippet