[thelist] CSS challenge, vertical-alignment

Steve Lewis nepolon at worlddomination.net
Thu Mar 3 16:40:03 CST 2005


Jay Blanchard wrote:

> NOT TESTED ....

> #header div.byline{
> 	margin-top: 75px; <-----you may have to adjust this
> 	text-align: right;
> }

That does work, pretty well.  That is exactly what I have done thus far:

<div class="bannerText">
   <h1 id="blogTitle"><?php bloginfo('name'); ?></h1><br>
   <h4 id="blogByLine"><?php bloginfo('description'); ?></h4>
</div>

[insert corresponding markup in CSS]

As a complication to this, the text is top-aligned to a point 75 px 
below the top of the page.  when you increase the font size from the 
browser controls this doesn't looks very good, as the text begins to 
overflow the banner area down and to the left.

What I would really *love* is a way to align the bottom of the text 
with a point on the screen, of with the bottom of the container 
(div.bannerText in this case) so that it would grow up and to the left 
instead.

Any ideas?

-- 
Steve Lewis


More information about the thelist mailing list