i have a parent container ('footer') where i have 2 child elements. the first ('feeds-techs') is floated right, while the second ('footer_text') is displayed inline to get its top border to display properly. 'feeds-techs' is taller that 'footer_text'.
what i want is for the container to expand to the height of 'feeds-techs'. i accomplished this using the
":after" pseudo-element. i also want the inline element to rest at the bottom of the container (so that the bottoms of the 2 child elements are even).
first, i tried to set the parent container to "vertical-align: bottom;" but to no avail. then, i attempted to use "clear: both;" on 'footer_text', but that didn't work in firefox (i'm assuming because it's an inline element) - it also didn't suit the display i wanted since 'footer_text" was then resting below 'feeds-techs'. i also attempted to use the ":before" pseudo-element on 'footer_text' and setting the height to 100%. still didn't work. then i tried to set the 'footer_text' to "margin-top: 100%;" - still nothing (actually, this caused the top border of 'footer_text' to disappear in ie -- ie sucks sooo bad

).
i'm wanting to steer clear of [x]
html hacks, like a "<div class='clearboth'></div>", because that's not very pure
css and it doesn't suit my semi-obsessive-compulsive disorder. ;-)
i'm sure there's a solution out there -- i'll be surprised if you can't solve this problem using pure
css.
if you would like to see the page in question and my code/stylesheets:
page in question (view source for my
xhtml)
stylesheet (if, for some really odd reason, you need to see my other stylesheets, you'll see their location in the source of my
xhtml - you should know where to look)
any ideas?