Definir estilos CSS especìficos para cada browser y OS

Leyendo un par de fuentes y navegando un poco me encontrè con esta herramienta/script CSS Browser Selector.

Consiste en un un script javascript MUY pequeño (893 bytes), y la utilizaciòn de estilos como selectores de browser y OS como muestra la misma pàgina en sus ejemplos.

html.gecko div#header { margin: 1em; } .opera #header { margin: 1.2em; } .ie .mylink { font-weight: bold; } .mac.ie .mylink { font-weight: bold; } .[os].[browser] .mylink { font-weight: bold; } -> without space between .[os] and .[browser]

Creo que puede ser de gran ayuda para cualquier web developer a la hora de realizar los benditos hacks.

Happy Coding!

CSS Reference

Hoy al recibir los mails me encontré con esta noticia:

“http://reference.sitepoint.com/

In this free online reference, the entire CSS language is clearly and concisely explained, including browser compatibility, working examples, and easy-to-read descriptions. 

The reference has been written by two of the world’s most renowned CSS experts — Tommy Olsson and Paul O’Brien — so you know it’s accurate, up to date, and best practice. 

If you’re building sites with CSS, this is a reference you’ll come back to time and time again. I hope you enjoy it.” 

Creo que es una MUY BUENA noticia, y muy buen material de consulta para todos nosotros los que nos dedicamos al diseño web.

Estilos CSS de los elementos LI

Hola a todos, hoy me tocó formatear una lista con CSS y no recordaba cuales eran los estilos a tocar.

Googleando encontré esta página: http://www.lawebera.es/manuales/css1/clasificacion.php

El atributo a tocar es: list-style y cuyos valores son: [disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none] || [inside | outside] || [<url> | none].

Diez trucos de CSS

Encontré este artículo que esta bastante interesante: http://www.evolt.org/article/Ten_CSS_tricks_you_may_not_know/17/60369/

Centrar texto verticalmente en un DIV

Bueno otro post para esos momentos que no me acuerdo como se hacen las cosas.

El problema centrar el texto de un div, la solución: http://wellstyled.com/css-single-line-vertical-centering.html

   #block {
      ...
      height: 5em;
      line-height: 5em;
      ...
      }

Hay que setear el atributo line-height al mismo valor que el height del div.