Conoce la forma de todo tu sitio con CSS

Normalmente suelo usar la propiedad border para ver cómo quedan posicionadas las divs de mis sitios, pero se hace un poco tedioso cuando tienes muchos elementos y los tienes que cambiar uno a uno. Casualmente me encontré este "truco" el otro día (no recuerdo donde), que nos puede hacer esta tarea más fácil.

Para usarlo tan sólo tenéis que añadir esto a vuestro css y cuando hayáis solucionado el posible problema de posicionamiento lo quitáis o lo dejáis como comentario.

(Lo que hace es asignarle un color de borde a cada elemento hasta el nivel 8, pero le podéis añadir más)

Código :

* { 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; }

Espero que os sirva, saludos

 

Tweet