Comunidad de diseño web y desarrollo en internet online

Texto de varias lineas con centrado vertical

Citar            
MensajeEscrito el 05 Ene 2007 10:27 pm
Tengo el siguiente código:

Código :

<html>
<head>
<script type="text/javascript" src="flashobject.js"></script>
<style>
<!--
body{
   background-color: #7D8B94;
   margin: 0px;
   padding: 0px;
}
#flash{
   position: absolute;
   top: 50%;
   left: 50%;
   width:770;
   height:460;
   margin-left: -385px;
   margin-top: -230px;
   text-align: center;
   font-family: Tahoma;
   font-size: 12px;
   color: #DDD7C4;
   <!--
   line-height: 460px;
   --!>
}
-->
</style>
<title>CRISTIAN RAMAL</title>
</head>
<body>
    <div id="flash">Usted necesita tener Javascript activado, para poder ver este sitio.<br>Línea 2</div>
    <script type="text/javascript">
      var cr = new FlashObject("Arquitectos.swf", "main", "770", "460", "8", "#7D8B94");
      cr.write("flash");
   </script>
</body>
</html>


Lo que quiero es que el texto adentro del div, me aparezca centrado verticalmente.
Usando la opcion line-height: 460px; (Comentada en el ejemplo), el texto me queda centrado; pero al agregar varias lineas de texto, no queda, y si comento esla opción, las lineas quedan bien, pero no centra.

Agradezco de antemano. :D
Buscando en goolge (Una de las ligas me llevo aqui!!), pude llegar a formar este código, pero no encuentro nada para resolver mi problema :(

Por rolv

Claber

2000 de clabLevel

3 tutoriales

 

firefox
Citar            
MensajeEscrito el 05 Ene 2007 11:35 pm
Tablas.

Tristemente, es la única manera de resolverlo. También podrías hacer esto con css:

Código :

#flash {
display: table-cell;
vertical-align: center;
}


Pero, claro, tenemos a IE, cosa a la que le vale poco tratar bien con display:table-cell.

Por Alan

470 de clabLevel

2 tutoriales

 

firefox
Citar            
MensajeEscrito el 06 Ene 2007 08:15 pm
u.u Las buenas tablas al rescate :D :D :D
Ni hablar!!! je je je je

Por rolv

Claber

2000 de clabLevel

3 tutoriales

 

unknown
Citar            
MensajeEscrito el 07 Ene 2007 12:29 am
err.. no es tabla, es propiedad de tabla.
la idea se conserva; sigues separando el diseño del contenido.

Por fael

BOFH

2443 de clabLevel

3 tutoriales
2 articulos

 

firefox
Citar            
MensajeEscrito el 08 Ene 2007 05:23 pm

fael escribió:

err.. no es tabla, es propiedad de tabla.
la idea se conserva; sigues separando el diseño del contenido.

Sip, display: table-cell;, es propiedad, pero no funciona bien como tal en tooooodos los navegadores + mas versiones.
El asunto es la complicación de hacerlo con css, "De la forma correcta", que con tablas "de la forma rápida".

Claro que luego viene el conflicto existencial entre profesionalidad, rápidez , calidad, apego a estándares, y sacar la chamba!!! :crap: :crap: :crap: :crap:

Por rolv

Claber

2000 de clabLevel

3 tutoriales

 

firefox
Citar            
MensajeEscrito el 08 Ene 2007 05:26 pm
checa este link, a lo mejor te sirve
http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

Por fael

BOFH

2443 de clabLevel

3 tutoriales
2 articulos

 

firefox
Citar            
MensajeEscrito el 08 Ene 2007 09:25 pm

fael escribió:

err.. no es tabla, es propiedad de tabla.
la idea se conserva; sigues separando el diseño del contenido.
Dije que podría utilizar tablas O el display.

Por Alan

470 de clabLevel

2 tutoriales

 

firefox
Citar            
MensajeEscrito el 09 Ene 2007 04:10 pm
Al final termine haciendo algo parecido al link que me envio Fael...
Mi punto es: no es demasiada Faramaya, para algo tan simple; o es el precio de hacer algo bien (Estandar, profesional, correcto, etc)

Por rolv

Claber

2000 de clabLevel

3 tutoriales

 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.