Ponle Estilo a tus Listas Ordenadas con CSS

Por defecto las listas ordenas muestran el número listado con el mismo estilo de fuente usado para el cuerpo del texto. Para diferenciarlo vamos a darle estilo mediante CSS y para eso haremos uso de otro elemento, como puede ser span o p en este caso p.

Practicamente lo que hacemos es aplicar un estilo a ol y resetear p (anidado en ol).

[Seguir leyendo…]

Pseudo-clases en Internet Explorer

Las pseudo-clases y pseudo-elementos son usados para crear efectos que no son accesibles por otros métodos. Como crear un efecto al pasar el cursor sobre un elemento (:hover) o cambiar la primera letra de un párrafo (:first-letter).

En esta entrada puse un ejemplo de una tabla estilizada con CSS por medio de pseudo-clases. Y como mencioné en Internet Explorer no funcionan los pseudo-clases.

Internet Explorer 6 solo soporta :hover y :active y sólo funcionan en los vínculos. Deja deshabilitadas muchas pseudo-clases y pseudo-elementos importantes:

[attr], [attr="value"], [attr~="value"] etc
:hover, :active, :focus (para todos los elementos)
:first-child, :last-child, only-child, nth-child, nth-last-child
:checked, :disabled, :enabled
:empty, :contains(), :not()
:before/:after/content:
:lang()

Para reparar esto podemos usar el script IE7. El proyecto se encuentra alojado en google code por lo que podemos ponerlo directamente en el html sin descargar nada, sólo colocamos el siguiente código dentro de <head>

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->

[Seguir leyendo…]

Alternar color de filas con CSS

Cuando la tabla es muy alta y ancha terminaremos perdiendo la fila en la que estabamos ubicados. Entonces para evitar esto se nos ocurre una cosa: alternar el color de las filas. Para lograrlo el método más recurrido es JavaScript y/o PHP. Y la mayoría nos olvidamos del método más sencillo: CSS.
[Seguir leyendo…]

CSS3 desastre de diseño

Lo sé, demasiado drámatico el titulo.css3.png Y empiezo a sonar como un anciando resistiendose al avance tecnológico. En realidad es posible y podría ser causada por algunas de las innovaciones de CSS3.

Hay muchas buenas implementacions que se avecinan con CSS3 y sin duda muchos agradeceremos. Como el caso de border-radius, pedido a gritos por webmasters desde hace mucho tiempo, al fin nos olvidaremos de apilar <b> o anidar divs para esta tarea; o el caso de opacity nos olvidaremos de tener que crear sprites para simular estados. Sin embargo estas mejoras bien podrian ser un tiro por la culata. Expondré tres propiedades que considero serían las culpables.
[Seguir leyendo…]

Siguiente Página »

Últimos 5 comentarios