TANTA Consultora digital con mas de 18 años de experiencia en el mercado. Somos digitales y nos transformamos contigo. Convertimos tus necesidades en soluciones.

Acerca del libro “Everything you know about css is wrong!”

(1 min lectura)

Tras una lectura del nuevo libro de SitePoint titulado: Everything You Know About CSS Is Wrong!

el título bien podría ser: “Cómo hacer estructuras de páginas con display:table y similares”. El libro que va directo al grano; se basa en la dificultad que existe a la hora de estructurar, maquetar, componer páginas mediante las técnicas actuales de hojas de estilo (CSS) y que mientras esta dificultad exista no se tome muy en serio el trabajo.

En la primera parte del libro, aparte de hablar sobre la guerra de navegadores y sobre la que vuelve a haber actualmente expone los diferentes métodos para hacer estructuras: posicionamientos y elementos flotados (float) así como de sus ventajas e inconvenientes.

Basándose en la pronta salida de Internet Explorer 8 y de su, por fin, soporte de los valores display:table, display:table-cell el libro muestra ejemplos de lo sencillo que resulta realizar bloques y estructuras que son sólidas y no tienen problemas a los que nos solemos enfrentar normalmente (alturas, ajustes de color entre columnas, etc, etc).

Incluso el libro trae una especie de preguntas frecuentes. Algunas de ellas:

  • ¿se puede usar este método para estructuras flexibles? (líquidas)
  • ¿pueden anidarse?
  • ¿cómo posiciono elementos dentro de estos bloques?
  • ¿están soportados los atributos rowspan y colspan? ¿se pueden simular?
  • ¿puedo cambiar el orden del contenido?

A partir de aquí, el libro ya deja en manos del lector el qué hacer. Obviamente la pega es que todo esto no funciona en Internet Explorer 6 y 7. Propone varias soluciones más o menos radicales:

  1. Ignorar navegadores “antiguos“, es decir, en cuanto salga el 8 olvidarse del 7 y del 6.
  2. Proporcionar una estructura más simplificada haciendo uso de hojas de estilo condicionales.
  3. Usar ambos sistemas; trabajar para navegadores de última generación con display:table y demás y hacer uso de hojas de estilo condicionales para trabajar versiones para Internet Explorer 6 y 7 de una manera “tradicional“.

La primera solución es muy radical y la segunda en términos reales no es factible ya que, a dia de hoy muy pocos están dispuestos a tener versiones con diseños simplificados. La tercera opción no es mala salvo que supone doble esfuerzo, pero como dice en el libro si no se empiezan a probarse los nuevos sistemas no se hará nunca.

Como nota curiosa, un elemento con un valor display:table no puede tener un valor position:relative ya que será ignorado.

Finalmente, el libro hace un repaso a la futura versión 3 de hojas de estilo y a su sistema de estructuras y bloques.

Un libro muy, muy recomendable.

TANTA
TANTA Consultora digital con mas de 18 años de experiencia en el mercado. Somos digitales y nos transformamos contigo. Convertimos tus necesidades en soluciones.

¡Tenemos una sorpresa!

Grupo Onetec Grupo Onetec
(4 min lectura)

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Ir al contenido