Alinear texto de un div abajo

[jona86]

Me estoy volviendo loco con algo que en principio no parece demasiado complicado, pero no consigo dar con ello, Como alinear un texto de un div abajo

Tengo una serie de divs como éste:

Código HTML:

<div class="alt4">Nuestros<br />Trabajos</div> 

Y su css es

Código HTML:

.alt4 {
	background-color: #31b3e7;
	height: 255px;
	margin-top: 5px;
}

Todo muy sencillo, pero quiero que el texto salga alineado abajo, pero no hay manera (y me niego a usar tablas )

A ver si alguien me echa una mano

Un saludo

[C2am]

Hola
Una posible solución:

Piensa que la alineación vertical css solo funciona con elementos de linea, y que tenga definida la altura de linea (line-height), ya esta altura hará de margen superior e inferior sobre la cual se alineará o posicionará.

Ahora, si defines dicha altura de linea en el div te encontrarás con que solo podrás colocar una linea (y en tu caso tienes dos debido al <br/>)

Entonces, una forma de solucionarlo es utilizar dos cajas (un div, y otra caja dentro que puede ser otro div, un p, span, etc., aplicandole la propiedad display:inline-block para que se comporte como un elemento de linea y bloque.

Al div contenedor le fijas el line-heigth igual a la altura del div, para poder alinear la caja interior con respecto a esta altura.

Luego a la caja interior, le defines como quieres que se posicione con respecto al eje y (altura): vertical-align:bottom - top - middle etc. Y vuelves a definir el line-height porque sino mantendrá el del padre (line-height:2em)

Código HTML:

<div class="alt4"><span>Nuestros<br />Trabajos</span></div> ​
 

Código CSS:

.alt4 {
    background-color: #31b3e7;
    height: 255px;
    line-height:255px; /* igual a height*/
    margin-top: 5px;
    text-align:center;
}
span {
    border:1px solid #ddd;
    display:inline-block;
    line-height:2em; /*vuelves definirlo con una altura necesaria para contener el texto */
    vertical-align:bottom;
}
 

El ejemplo para puedas ver su funcionamiento y probar alternativas.

Saludos