Editar

<p>Acabo de descubrir por accidente un peque&ntilde;o truco CSS que me servir&aacute; durante toda la vida para examinar visualmente si existen desperfectos en la estructura (o maquetaci&oacute;n) del HTML con el estilo CSS.</p> <p>Se trata simplemente de aplicar un <strong>outline</strong> visible a todos los elementos del CSS, de la forma:</p> <pre class="codigo"><span class="c1"><span class="c2"><span class="c3"><span class="c4"><span class="c5">* { outline: 1px dotted #CCC; }</span></span></span></span></span></pre> <p>De esta manera se marcar&aacute;n todos los elementos como divs, p&aacute;rrafos, listas, campos de formularios y todo lo que se tenga presente en el documento con una linea de tama&ntilde;o 1 pixel con color hexadecimal #CCCCCC (gris claro) y que no se suma a los tama&ntilde;os establecidos.</p> <p>As&iacute; puedes observar qu&eacute; elementos est&aacute;n desalineados o tienen menos separaci&oacute;n que otros cuando pensabas que todo estaba perfectamente maquetado.</p>

o salir