Centrado vertical

Pekotes · #1 (**permalink**) 02/05/2006, 17:12

Buenas, es la primera vez que escribo. Leyendo se aprende y por eso estoy en eso. Estoy empezando con esto de hacer pags web
Mi pregunta es: ¿Cómo hago para poder centrar verticalmente algún texto?
text-align: center --> me lo centra horizontalmente

Saludos a todos y gracias a que por lo menos se molestaron en leer mi pregunta.

Jorolo · #2 (**permalink**) 02/05/2006, 17:45

Hola pekotes.

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title lang='es'>un ejemplo simple</title>

<style type="text/css">

.baseline { vertical-align: baseline; }
.middle { vertical-align: middle; }
.sub { vertical-align: sub; }
.super { vertical-align: super; } 
.text-top { vertical-align: text-top; font-size: x-small;}
.text-bottom { vertical-align: text-bottom;  font-size: x-small;}
.top { vertical-align: text-top;  font-size: x-small;}
.bottom { vertical-align: text-bottom;  font-size: x-small;}
.porcentaje { vertical-align: 50%; }
.medida { vertical-align: -1em; }
</style> </head>
<body>

 <p>parrafo con <em class='baseline'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='middle'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='sub'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='super'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='text-top'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='text-bottom'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='top'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='bottom'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='porcentaje'>em alineado verticalmente</em></p>
 <p>parrafo con <em class='medida'>em alineado verticalmente</em></p>

  <a href="http://www.sidar.org/recur/desdi/traduc/es/css/visudet.html#q22">css2</a>

 </body> </html>

Pekotes · #3 (**permalink**) 03/05/2006, 09:42

Hola Jorolo, gracias por interesarte pero no me funciono :(
Mira lo q kiero hacer...

HTML:
<div class='opciones'>
<div class="boton">Hola</div>
<div class="boton">Chau</div>
</div>

CSS:
.opciones { float: left; width: 100%; height: 25px; font-family:Geneva, Arial, Helvetica, sans-serif; text-align: center; background: #000 /*aca poner que este centrado verticalmente*/}
.boton { float: left; width: 100px; color:#FF0000; font-weight: bold}

O sea que tengo por el momento 2 futuros botones... esta bien lo que estoy haciendo??

Jorolo · #4 (**permalink**) 03/05/2006, 10:56

Hola pekotes.

Baya, lo siento. Crei que preguntabas como alinear texto.

MaXaC · #5 (**permalink**) 03/05/2006, 11:01

Me parece que en la clase opciones para ul, deberias asignar margin top y margin bottom tanto como para que se vea centrado verticalmente con respecto a su contenedor algo asi:
..
margin: 5px 0;
o sino
...
margin-top:5px;
margin-bottom: 5px
---
no se me ocurre otra solucion

webosiris · #6 (**permalink**) 03/05/2006, 12:14

respuesta en ovillo

Pekotes · #7 (**permalink**) 15/05/2006, 18:14

Muchas gracias a todos, pero al final lo pude hacer.
Nos vemos, salu2 a todos!

Jesusguevarautomotri · #8 (**permalink**) 15/05/2006, 18:34

Aqui hay otro articulo por si quieres ampliar tus conocimientos.
Texto vertical usando ccs de Desarrollo web.com