Texto en vertical

Bueno, la idea es hacer que el texto de un titular se lea en vertical en vez de en horizontal [como es lo normal]

No se si se podra hacer con Hojas de estilo o algo asi.

Aqui podeis ver el ejemplo de lo que quiero http://www.va-mas.com ... es mi paginilla en Flash, y me gustaria poder hacer una similar en HTML.
El texto me da igual que sea esactamente como el que tengo... tambien me serviria algo asi:

D
I
S
E
Ñ
O

pero claro, me gustaria que el texto estubiese escrito normalmente en un DIV, en vez de dar un enter por cada letra.


Bueno, pues eso... si sabeis como se hace genial, sino usare una imagen o el texto + enter

Puedes hacer esto?:

Código :

<style type="text/css">
#txt span{
   display:block;
}
</style>

<div id="txt"><span>D</span><span>i</span>s<span>e</span><span>n</span>i<span>o</span></div>

aunque se que es algo malo.. pero si funciona (sin usar saltos de linea)

Salu2

aunque la solución de xroa puede que sí sea válida y no afecte tanto la usabilidad, yo preferiría utilizar la técnica de los títulos:
1. en el html lo escribes normalmente en un div
2. con css "escondes" el texto con text-indent: -600000px;
3. utilizas una imagen de fondo

suerte, un saludo

Ole, voy a probar ambas tecnicas a ver que resultado dan...

Gracias.

Xroa© escribió:

Corregido el detalle del selector

Animatek, vi la pagina que pones para tener una idea y creo que como quieres la direccion del texto es imposible hacerlo ahora, por el momento, creo que la mejor solucion es crear una imagen de ese texto y aplicarlo (siempre puedes usar la tecnica de fael o alguna parecida)..

Salu2

Si, eso de girar las letras ya suponia que no se iba a poder, pero con el resultado que me diste [y la pequeña correccion de ramm] me va mas que bien...
La opcion de fael tampoco esta mal [yo habia pensado algo parecido]... pero prefierop dejarlo con texto normal en vez de una imagen... por aquello de aligerarla todo lo posible.

Gracias de nuevo por las ideas dadas

Ahora que estoy leyendo más sobre Javascript y DOM, haria algo como esto.

<p class="vertical_text">Diseño</p>

.vertical_text { text-transform:uppercase; font-weight:bold; }
.vertical_text span { display:block; }

Y agregaria un span entre cada letra con javascript, de forma intrusiva