Search code examples
alignment

Content in div aligns to the bottom

I have a header div, inside this is some content. The whole div is text-align:right. I want the content to sit on the right but more importantly sit on the bottom of the div, not the top.

#header {

height:79px;
background:url(images/jtl-logo.png) no-repeat left top;
text-align:right;
padding:0px 9px; }

Surely there must be a way of doing this in the CSS so that content always aligns to the bottom of it's container, it seems like it's incredibly necessary?

The only other way I can think to do it is applying padding to the header to push it down, but that seems a bit ridiculous when this is such a simple thing.

Solution

  • You could wrap up the text in another DIV or SPAN element and then apply CSS positioning to move it to the bottom.