CSS

Artículos del blog de Emenia sobre CSS: trucos, mejores prácticas, ejemplos y tutoriales que pueden ayudarte a la hora de crear tu hoja de estilos cuando diseñes y desarrolles tu página o aplicación web.

display: flow-root

Parece que pronto tendremos disponible display: flow-root. Tanto Chrome Canary como Firefox Nightlies lo soportan ya. Va a ser muy útil ya que nos vamos a quitar de encima el engorro de usar clearfix y soluciones parecidas cuando un elemento contenedor tiene en su interior otro elemento con “float” siendo la altura de este elemento […]

Seguir leyendo

font-display para @font-face

Ya está cerca la posibilidad de usar font-display en nuestra declaración de @font-face. Chrome Canary ya lo incluye por lo que en poco tiempo lo tendremos disponible en Chrome. Utilidad de font-display Como sabéis, cuando utilizamos una fuente a través de @font-face el navegador no nos muestra nada hasta que la fuente está disponible (comportamiento […]

Seguir leyendo

FlexBox: La caja flexible con CSS 3

Este era un artículo original del 2012. Dado el momento actual y ya definitivo de Flexbox, ha llegado el momento de poner este artículo al día para que os sea útil. Flexbox ya está listo. Es el momento de usarlo. Flexbox viene a solucionar uno de los mayores quebraderos de los diseñadores de páginas web: […]

Seguir leyendo

CSS: Especificar line-height con o sin unidades

La semana pasada me preguntaba una persona porqué cuando aplica la declaración line-height (altura entre líneas) de 1.4em a la etiqueta “body” (o a cualquier contenedor) esta no se aplicaba a todos los elementos que están en su interior en función de su tamaño. Es decir, si hay elemento “p” en el interior del contenedor […]

Seguir leyendo

Sintaxis de @font-face a prueba de bombas

Artículo de Footspring.com donde nos muestra la mejor manera de declarar en nuestra hoja de estilos @font-face para conseguir la más amplia compatibilidad posible:

El secreto está en el ‘#’ a continuación de EOT. La gente de Footspring lo ha probado en Safari 5.03, IE 6-9, Firefox 3.6-4, Chrome 8, iOS 3.2-4.2, Android 2.2-2.3, […]

Seguir leyendo