3 cosas: 1ro el position absolute no es necesario. 2do: la clase vertical no existe, en cambio en el html tenes usado transform usa en ambos lados la misma.
y por ultimo el verticalText que la clase si esta bien, no te funciona por falta de los ; al final de la linea, tonces el interprete de css esta tomando todo como una sola declaracion.. siempre en css despues de cada declaracion debes poner un ; Corrije eso y quedara andando. Cualquier cosa estoy a tu disposicion _____________________________________ Leandro Asrilevich | www.beastxblog.com FrontEnd Developer Movil: +54 (11) 15 3663 0011 Web: http://www.beastxblog.com MSN: bea...@gmail.com Skype User: leandro.asrilevich Dorrego 328 Muniz - Partido de San Miguel Buenos Aires - Argentina 2010/12/16 German Bustos <ger...@atarraya.org> > Este es mi código, que no funciona > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" > "http://www.w3.org/TR/html4/loose.dtd";> > > <html> > > <head> > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> > <title>Test</title> > <style> > .contiene{ > width: 50%; > border: 2px solid #CCC; > } > > > .verticaltext { > -webkit-transform: rotate(90deg) > -moz-transform: rotate(90deg) > -o-transform: rotate(90deg) > transform: rotate(90deg) > } > .vetical{ > -webkit-transform: rotate(270deg); > -moz-transform: rotate(270deg); > -o-transform: rotate(270deg); > position: absolute; > } > > > </style> > </head> > > <body> > > <div class="verticaltext">Lorem ipsum y demás huevadas</div> > <div class="contiene"> > <div class="transform">Lorem ipsum y demás huevadas</div> > </div> > > </body> > > </html> > > > +++++++++++++++++++++++++++++++++++++++++++ > Y este el que bajé de CSS3Maker > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " > http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> > <html xmlns="http://www.w3.org/1999/xhtml";> > <head> > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> > <title>www.css3maker.com</title> > <style type="text/css"> > body{ font-size:18px; color:#FFF; } > a { color:#FFF} > .classname { border:solid 1px #2d2d2d; text-align:center; > background:#575757; padding:100px 50px 100px 50px; -moz-border-radius: > 5px; -webkit-border-radius: 5px; border-radius: 5px;} > > /* =Your Generated css > > |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/ > .classname a{position:absolute; left:40%; -webkit-transform: > rotate(270deg);-moz-transform: rotate(270deg);-o-transform: > rotate(270deg);writing-mode: bt-lr;} > /* End of Your Generated css > > |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/ > </style> > </head> > > <body> > <div class="classname"><a href="http://www.css3maker.com";> > www.css3maker.com > </a></div> > </body> > </html> > > > El 16 de diciembre de 2010 19:36, Leandro Asrilevich <bea...@gmail.com > >escribió: > > > fijate que el ejemplo que te pase y lo que tenes en el link que diste de > > ejemplo vos es lo mismo.. > > > > pega aca el codigo que estas usando asi veo por que puede no estarte > > andando. > > > > _____________________________________ > > > > Leandro Asrilevich | www.beastxblog.com > > FrontEnd Developer > > Movil: +54 (11) 15 3663 0011 > > > > Web: http://www.beastxblog.com > > MSN: bea...@gmail.com > > Skype User: leandro.asrilevich > > > > Dorrego 328 > > Muniz - Partido de San Miguel > > Buenos Aires - Argentina > > > > > > 2010/12/16 German Bustos <ger...@atarraya.org> > > > > > Hola, > > > > > > No me funciona el código que mandas, pero cuando lo hago con > > > http://www.css3maker.com/text-rotation.html# y lo descargo me > funciona, > > no > > > entiendo cuál es el truco ¿la definición del DOM? ¿position: absolute > > > (probé > > > y no funcionó)? Yo veo mi código casi igual pero no funciona.... > > > > > > Germán > > > > > > El 16 de diciembre de 2010 15:47, Leandro Asrilevich <bea...@gmail.com > > > >escribió: > > > > > > > .verticaltext { > > > > -webkit-transform: rotate(90deg) > > > > -moz-transform: rotate(90deg) > > > > -o-transform: rotate(90deg) > > > > transform: rotate(90deg) > > > > } > > > > > > > > opera no se si lo soporta aun, pero te agregue como seria si lo > > > soportase. > > > > > > > > para webkit (chrome, safari) y firefox estaria andando, y te puse la > > > ultima > > > > declaracion "transform" para cuando los browsers empiecen a > soportarlo > > > > directo sin usar el vendor filder > > > > _____________________________________ > > > > > > > > Leandro Asrilevich | www.beastxblog.com > > > > FrontEnd Developer > > > > Movil: +54 (11) 15 3663 0011 > > > > > > > > Web: http://www.beastxblog.com > > > > MSN: bea...@gmail.com > > > > Skype User: leandro.asrilevich > > > > > > > > Dorrego 328 > > > > Muniz - Partido de San Miguel > > > > Buenos Aires - Argentina > > > > > > > > > > > > 2010/12/16 Ariel <isaacr...@gmail.com> > > > > > > > > > Hola a todos: > > > > > > > > > > Quiero poner un texto en posicion vertical, no con las letras una > > > debajo > > > > de > > > > > la otra si no las palabras en una linea de oracion girada 90 grados > > > hacia > > > > > la > > > > > izquierda, ya sé como hacerlo en internet explorer con unos filtros > > > > > especiales de ese navegador: > > > > > .verticaltext { > > > > > writing-mode: tb-rl; > > > > > filter: flipv fliph; > > > > > } > > > > > > > > > > Lo que quiero saber es como hacerlo para mozilla-firefox, chrome y > > > opera. > > > > > > > > > > Si alguien me puede ayudar y dar una idea se lo agradecería. > > > > > Gracias de antemano > > > > > Saludos > > > > > _______________________________________________ > > > > > Lista de distribución Ovillo > > > > > Para escribir a la lista, envia un correo a > Ovillo@lists.ovillo.org > > > > > Puedes modificar tus datos o desuscribirte en la siguiente > dirección: > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > > > > > _______________________________________________ > > > > Lista de distribución Ovillo > > > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > > > > > > > > > > > > -- > > > > > > *Germán Bustos* > > > Asesor en estrategias de comunicación en Internet para organizaciones > > > sociales > > > http://atarraya.org > > > http://germanbustos.com > > > Tel: (+57) 3177381339 > > > <http://atarraya.org/> > > > <http://germanbustos.com/> > > > <http://www.facebook.com/german.bustos> > > > <http://twitter.com/kommodin> > > > <http://www.linkedin.com/in/germanbustos> > > > _______________________________________________ > > > Lista de distribución Ovillo > > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > _______________________________________________ > > Lista de distribución Ovillo > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > > -- > > *Germán Bustos* > Asesor en estrategias de comunicación en Internet para organizaciones > sociales > http://atarraya.org > http://germanbustos.com > Tel: (+57) 3177381339 > <http://atarraya.org/> > <http://germanbustos.com/> > <http://www.facebook.com/german.bustos> > <http://twitter.com/kommodin> > <http://www.linkedin.com/in/germanbustos> > _______________________________________________ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > _______________________________________________ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
