Say I have a page:
<body>
<div id="header">
<h1>some title</h1>
some header content
</div>
<div id="content">
Some content
</div>
</body>
and the corresponding css
#header
{
height: 150px;
}
The header section is of fixed height but the content of that section may change. I would like to content of the header to be aligned to the bottom of the header section, so the last line of text "sticks" to the bottom of the header section.
So if there is only one line of text it would be like:
----- header section --------
|
|
|
| one line header text
-----------------------------
and if there were say 3:
----- header section --------
|
| first line of header text
| second line of header text
| third, last line of header text
-----------------------------
How can this be done in css?