secciones

CSS Reset

Me ha parecido interesante el planteamiento de Eric Meyer con su CSS Reset.

La idea es llevar hasta el extremo eso que muchos hacemos cuando empezamos a diseñar una hoja de estilo. Yo siempre pongo la siguiente regla la primera:

* {
  margin:0;
  padding:0;
}

El objetivo de esto es evitar que los márgenes que cada elemento html tiene en cada navegador me mareen cuando estoy diseñando. En algunos navegadores, los elementos h1 tienen un determinado margen superior. En otros navegadores este margen es distinto. Poniendo esta regla, me aseguro de que elimino estos margenes y me ahorro incompatibilidades. Si quiero un determinado margen en un elemento, lo pongo yo de modo consciente.

CSS Reset son una serie de reglas que hacen esto con todos los estilos: márgenes, tamaños de letra, alineaciones, etc. Se trata de eliminar completamente los estilos por defecto del navegador para empezar con una hoja en blanco sobre la que poder aplicar nuestros estilos sin que los estilos por defecto interfieran.

3 Comentarios
Jorge
Jorge
21 mayo 2007, 00:00 — #1

Si escarbas un poco por la red verás que desde hace tiempo hay montado un gran debate sobre cuál es el “reset perfecto”, es un tema muy interesante. Ese renglón CSS de Meyer es muy potente, pero deja muchos flecos gráficos sin resolver que cambian de un navegador a otro como ciertas propiedades de tablas, fieldsets, borders de enlaces activos… en fin, que no es tan sencillo como parece lo de hacer un buen reseteo de estilos.

Juanjo Navarro
21 mayo 2007, 12:53 — #2

Ya me imagino, Jorge. De todas formas utilizaré este hasta que encuentre otro mejor. Y he leído que Meyer seguramente continuará perfeccionando este tema, con una URL propia, etc.

Estaremos al tanto.

Gabriel Porras
24 mayo 2007, 15:39 — #3

Te recomendaría leyeras lo que dijo Faruk Ates sobre este Reset. Es muy bueno, pero también depende de lo que se necesite.

Revisa aqui: Escoge tu CSS Inicial: Eric Meyer vs. Faruk Ateş: http://uxespanol.blogspot.com/2007/05/escoge-tu-css-inicial-eric-meyer-vs.html

Saludos!

Comentarios cerrados para este artículo

Anterior: Switcher Siguiente: 20 formas de mejorar tu blog