Buscando una solución nos hemos encontrado con un excelente artículo titulado Two CSS Hacks for identical pages on FF, IE6 & IE7. Hemos aplicado las soluciones propuestas en él y han funcionado perfectamente. No se si son la manera más ortodoxa de hacerlo, pero funcionan. Consisten en lo siguiente:

1. Realizar el diseño para Firefox

2. Comprobar los fallos que el diseño muestra en IE6. Identificar los selectores que presentan el problema y duplicarlos, anteponiendo a la copia el selector *html y aplicando los cambios requeridos, de la siguiente manera:

#MyDiv {margin: 10px 10px 10px 10px;}

/* IE6 Only */
* html #MyDiv {margin : 5px 5px 5px 5px;}

De ese modo, mientras Firefox leera el primer #MyDiv, IE6 sólo leerá el segundo.

3. Hacer lo mismo con IE7. Volver a duplicar los selectores en conflicto y añadir *:first-child+html a los duplicados:

#MyDiv {margin : 10px 10px 10px 10px;}

/* IE6 Only */
* html #MyDiv {margin : 5px 5px 5px 5px;}

/* IE7 Only */
*:first-child+html #MyDiv {margin : 2px 2px 2px 2px;}

Así, IE7 sólo leerá el último selector.

Con esta técnica podemos diseñar hojas de estilo únicas para los tres navegadores, sin complicarnos con otras técnicas más dificiles para los que no somos expertos en la materia.

A este paso no hará falta saber nada de HTML ni de CSS para crear nuestro propio estilo visual.

Vía | Ajaxian

Vía | Ajaxian

Hay que ver hasta donde llegan algunos fanáticos del OS X. En hickdesign podemos descargarnos los archivos css necesarios para darle a Bloglines un aire Mac.

Están disponibles para Camino y Firefox y Safari, Omniweb y Opera. Y atención a las instrucciones de instalación. Pueden llevar un ratito pero creo que vista la imagen, merece la pena.

La imágen habla por si misma. Si estás habituado a trabajar con CSS seguro que lo que ves te estara gustando.

Puedes hacer cambios dinamicamente en el CSS de la derecha y ver los resultados al instante en la página web a la izquierda. Wow, otro motivo más para ser un switcher.

[Vía Ajaxian]