Archive for css

CSS hack para safari y chrome

Tags: ,

@media screen and (-webkit-min-device-pixel-ratio:0)
{
div
{
color: red; /* The text will appear red only in Safari and Google Chrome */
}
}

Continue reading » No comments

Rotando texto con CSS

Tags:

Jonathan Snook, publica un intersante artículo en el que nos muestra como rotar texto mediante CSS.

 
El código está claro que no es estandar y solo funciona en Safari/WebKit, Firefox e Internet Explorer.
//HTML
<div class=”example-date”>
<span class=”day”>31</span>
<span class=”month”>July</span>
<span class=”year”>2009</span>
</div>

//CSS .year { [...]

Continue reading » No comments

Opacidad con CSS Cross-Browser

Tags:

.show-50 {-moz-opacity:.50;filter:alpha(opacity=50);opacity:.50;}

Continue reading » No comments

Cookies con jQuery

Tags: ,

Una cookie es un fragmento de información que se almacena en el disco duro del visitante de una página web a través de su navegador. Muy útil en la programación web para guardar y leer algunos datos de configuración. Crear, configurar, leer su valor y eliminarla es fácil con jQuery.
 
 
 
Crear una cookie en jQuery es tan fácil como [...]

Continue reading » No comments

Técnicas para Cross-Browser CSS

Tags:

Con CSS (Hojas de estilo en cascada) también se habla de Cross-Browser, desarrollo de páginas web que se ven exactamente igual en cualquier navegador. Existen algunas técnicas CSS con ese objetivo. Veamos algunas:
Resetear CSS
La mayoría de navegadores definen por defecto diferentes estilos para los elementos HTML. Por ello lo primero a realizar en nuestro diseño es resetear nuestra [...]

Continue reading » No comments

¿px, em, %, pt, o palabras clave?¿Como definimos tamaños de fuentes?

Tags: ,

CSS-Trick, nos muestra un interesante artículo sobre las cualidades de los diferentes sistemas que tenemos para indicar el tamaño de las fuentes de nuestras aplicaciones.

px: Ofrece el máximo de precisión a la hora de indicar un tamaño. Aunque se olvidan del usuario, no hacen caso a la configuración del visitante.
em: Los más difíciles de cuadrar [...]

Continue reading » No comments

CSS Poligonal para crear tooltips con punteros

Tags:

En Group Filament han escrito un post en el que explican como usar CSS poligonal para crear tooltips que tengan punteros pero sin utilizar imágenes.
El concepto queda explicado con el siguiente CSS:
div {
width:0;
height:0;
border-left: 20px solid transparent;
[...]

Continue reading » No comments

¿Por qué maquetar con estándares?

Tags: ,

 Resumen: Hace poco me pidieron una presentación para justificar por qué hay que codificar webs mediante XHTML y CSS. Con lo fácil que es maquetar con tablas? Este es un resumen de las conclusiones que defendí.
Mirando al pasado. En el inicio sólo había tablas
Esta frase no es del todo cierta, aunque si lo parezca. Las [...]

Continue reading » No comments

Botones con Imagenes Reutilizables(GMAIL)

Tags:

Mientras esperamos que alguna futura versión de HTML nativo nos de nuevos controles para que usemos en el navegador, en Google han jugado y experimentaron nuevos controles que ellos llaman “Custom Buttons”y las han puesto en sus aplicaciones. Estos botones los pusieron en marcha en Gmail y Google Reader recientemente.
Los botones están diseñados para un [...]

Continue reading » No comments

10 sucios trucos para CSS

Tags:

Martin Ivanov ha hecho una recopilación de 10 hacks CSS que seguro nos pueden servir en algún que otro momento.
1) Mejorando el escalado y resampleado de las imagenes en Internet Explorer
En Internet Explorer 7 la propiedad de escalado por el método bicubic está deshabilitada por defecto y debemos activarla nosotros desde nuestro CSS indicando que [...]

Continue reading » No comments