Desde IE10 quer ya no existen los comentarios condicionales, ese útil invento de Microsoft para que nosotros desarrolladores front-end pudiéramos lidiar con los estilos específicos para IE5, 6, 7, 8…. y 9. Los quitaron porque creían que con IE10 todo […]

Estilos para IE9, IE10 e IE11
18/jun/2014 8

Crear formas geométricas con puro CSS y 1 elemento HTML ha sido una tarea creada hace años ya y que tiene recopilaciones varias de métodos y usos. Personalmente para crear triángulos con CSS uso un generador genial que espero nunca […]

Triángulos con CSS: LESS Mixin
10/jun/2014 2

Sucede que creamos lindos estilos para elemento con CSS3 y queremos aplicar la propiedad transform para darle profundidad 3D. Observamos que ocurre lo siguiente en Firefox:

3D CSS3 transform con bordes dentados en Firefox
16/may/2014 3

Existe una propiedad CSS3 muy tímida y poco manejada pero que cumple un papel esencial cuando estamos trabajando con animaciones CSS3. Supongamos que estamos creando una animación simple, que no necesitamos sea cíclica, por lo tanto, la ejecutaremos sólo 1 […]

Animaciones CSS3 al fin del ciclo
26/mar/2014 0

Los formularios son una de las razones de porque el mundo corporativo entró a Internet: captura de datos de usuarios. Es la forma más fácil y rápida de obtener ese ansiado contacto, con el cual puedo convertir a ese usuario […]

Checkboxes con estilo
17/mar/2014 3

Utilizar pre-procesadores CSS se ha vuelto una necesidad en la actualidad, ya que sus múltiples ventajas hacen que no exista excusa para seguir escribiendo CSS puro. Lo mejor es que no intervenimos el lenguaje, sólo lo escribimos más eficiente. Ahora […]

Auto-prefix en Sass
5/mar/2014 1

La propiedad CSS content: “”; viene siendo utilizada para entregar más estilos donde no necesitas extra marcado con HTML. Su soporte es amplio (IE8+ y demases browsers modernos). Su uso está atado a los pseudo-elementos :after y :before y permite […]

Pseudo contenido con CSS
11/dic/2013 0

Calc() es una propiedad CSS3 que permite realizar operaciones matemáticas simples sustituyendo un valor fijo por una expresión dinámica de medida, por ejemplo, sumando o dividiendo anchos de un contenedor.

CSS3: calc()
18/nov/2013 1

Con HTML5 llegaron muchas nuevas etiquetas y atributos, y se nota que en la W3C se esforzaron en la captura de datos. Los formularios tuvieron muchas mejoras y en este artículo mostraré como manipular un útil atributo: placeholder. Placeholder permite […]

Dando estilos a placeholder
23/oct/2013 4

En desktop, para tener un elemento escroleable basta con que declares un alto fijo y defines overflow: auto | overflow: scroll y si el contenido interior es mayor que el alto aparecerá la barra de scroll automáticamente. En browsers móviles […]

overflow: scroll en iOS
20/ago/2013 0

Este es un comportamiento por defecto de los browsers para móviles, el cual al hacer algún tipo de arrastre extremo dentro del <body> (me refiero del extremo superior al inferior principalmente, ó si está en landscape de derecha a izquierda […]

Movimiento del browser al arrastrar en móviles
11/mar/2013 2

Nuevos conceptos pero no tan nuevas técnicas. La moda del diseño/desarrollo responsive hace necesaria una aclaración de algunas definiciones. Y qué mejor que hacerlo con un ejemplo utilizando las mismas técnicas descritas, para que puedan bucear por el código fuente.

Layout Responsive / Adaptativo / Flexible
4/feb/2013 4

Hace meses que tengo la idea de generar varios micro-cursos, donde en no más de 30 minutos expongo varias ideas puntuales sobre temas orientados al desarrollo web. En esta ocasión les traigo el primero de ellos: Diseñando con CSS3, donde […]

Diseñando con CSS3: micro-curso y slides
26/dic/2012 6

Problema: a través de CSS, necesitaba entregar estilos al primer hijo de un elemento sin afectar la herencia (nietos y más allá); sólo necesito darle estilo al hijo directo de un selector. Además: debiera ser genérico, sin restringirse al tipo […]

Alcanzar el primer hijo de un selector pero no su descendencia
18/dic/2012 4

Me entretengo mucho inventando proyectos donde pueda aplicar CSS3 a destajo sin importarme un carajo las limitaciones de los browsers. Buscando una solución elegante para aplicar el mismo efecto reflejo que tan fácil es hacer en Photoshop, pero con CSS3, […]

Reflejo horizontal y vertical con CSS3
12/dic/2012 5

Situación: tenemos un menú con N elementos, los cuales se van activando (opacity: 1) a medida que el mouse pasa sobre cada uno, mientras el resto de los elementos permanecen inactivos (opacity: 0.5). Un efecto simple que se puede realizar […]

FadeIn/Out en menú con CSS
8/oct/2012 0

Este es un bug molesto, donde a partir de algunas tipografías (generalmente de palo seco y delgadas) tienen un pobre renderizado en Chrome en Windows. Buscando una solución me deparo con 4 diferentes; finalmente solo la solución 2 me resulta […]

@font-face y renderizado de texto en Chrome Windows
21/sep/2012 5

Érase una vez una tímida propiedad CSS que pocos conocen y nadie usa, pero que es muy beneficiosa cuando tratamos con textos.

Mejor renderizado para textos
16/ago/2012 4

Tonteando con una idea que tuve de un bookmarklet (una analogía gráfica que contamina visualmente un sitio web de la misma manera en que estamos contaminados quienes vivimos en grandes ciudades), tuve una epifanía y pude resolverla. La idea es […]

Pointer-Events en CSS3
27/jul/2012 1

Con CSS3 el soporte a múltiple background nos permite ser mucho más creativos al momento de solucionar problemas de estilos, cuando antes sólo dependíamos de crear y anidar etiquetas y cortar esos gif’s y png’s que tanto nos han atormentado. […]

Backgrounds múltiples en CSS3 y un truco gradual
27/jun/2012 6

Contexto: día de semana laboral, cliente envía sus observaciones: Después de leer un poco, dí con la solución la que presento a continuación. Básicamente con CSS2 existió una propiedad que permitía que se definiera el modo de impresión a través […]

Impresión portarretrato con CSS3
29/may/2012 1

CSSLab

⤷ Categoría CSS