Problema con vertical-align de un <div>

Carlillus · #1 (**permalink**) 29/10/2009, 16:55

Hola, desde hace rato estoy intentando que el texto de un div aparezca en la parte de abajo de este, pero no lo consigo, siempre se muestra arriba del todo...

Este es el código que uso:

Código HTML:

<body>
<div class="top_header">
	Texto
</div>
</body>

y el CSS

Código PHP:

  body{
    background:url(../images/interface/top/bg_blue.jpg);
    text-align:center;
    margin:5;
    padding:5;
}
.top_header{
    vertical-align:bottom;
    position:relative;
    background:url(../images/interface/top/header_original.png);
    width: 1000px;
    height: 175px;
    background-repeat:no-repeat;
    margin:auto;
}

He probado poniéndole display: table-cell; con eso consigo que se vea abajo, pero a la vez el div se descentra de la página y se va hacia la izquierda...

Cuál es el problema? Gracias

cristian_cena · #2 (**permalink**) 29/10/2009, 20:17

Hola Carlillus: y si incluyes el texto en una etiqueta <span> (linea) o <p> (bloque) ?. Con ello lograrias que el texto tenga su propia "caja css" lo que te permitiría despues posicionarlo a tu gusto con las propiedades: margin, padding, float y position.

Saludos!

alexk · #3 (**permalink**) 29/10/2009, 23:00

lo mas importante es saber que quieres hacer que soluciones hay muchas pero cada caso es distinto... asi que si nos pones la URL del problema seria bueno...

kseso? · #4 (**permalink**) 30/10/2009, 06:42

No hace tanto que se comentó el mismo tema, es una pena que se use tan poco el buscador.

Vertical-align sólo se puede utilizar con elementos de línea y table-cell
Para poder aplicar el table-cell antes debe estar declarado el display: table
Hay que proveer opciones para "display:table" y la familia de ie

Como te comentan Cristian y Alexk falta información para poder dar una respuesta concreta o una alternativa válida en tu caso.

Un saludo