Leo en Ajaxian una entrada que nos explica como conseguir con los motores de los navegadores más comunes escribir texto en vertical sólo con css. Esta es una limitación que en ocasiones obliga a pasar a imagen los textos verticales de los diseños.
Lo dejo aquí como apunte, ya que no es algo tan común como para memorizar, espero que le saquéis partido:
span#myText{
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
4 respuestas a “texto vertical con css”
Un recurso curioso, lástima que no cumpla los estándares web de CSS 2.1. Aunque siempre nos quedará implementarlo mediante javascript para mostrar una imagen en caso de que no esté soportado y el CSS en caso contrario…
Un saludo,
Alejandro Arco
Pues no es mala idea, solo habría que sumarlo a las opciones del metodo .css() de jquery tal cual ya lo hace con «opacity» y a vivir. La lastima es el estado sin javascript que para que no rompa la maqueta supongo que habría que ponerle un display:none por si las moscas…
Buena idea!
Quisiera saber si existe alguna manera de rotar el texto en IE que no sea 90 180 gradfos y igamos que fueran 33 grados.
Gracias
Con css en IE creo que no puede hacerse.
Para eso deberías buscar soluciones más rebuscadas: usar flash, una aplicación que te pase un texto a imágen o canvas mediante javascript…