How do I get a div to float to the bottom of its container?
css, css-float, html
Solution
After struggling with various techniques for a couple of days I have to say that this appears to be impossible. Even using javascript (which I don't want to do) it doesn't seem possible.
To clarify for those who may not have understood - this is what I am looking for: in publishing it is quite common to layout an inset (picture, table, figure, etc.) so that its bottom lines up with the bottom of the last line of text of a block (or page) with text flowing around the inset in a natural manner above and to the right or left depending on which side of the page the inset is on. In html/css it is trivial to use the float style to line up the top of an inset with the top of a block but to my surprise it appears impossible to line up the bottom of the text and inset despite it being a common layout task.
I guess I'll have to revisit the design goals for this item unless anyone has a last minute suggestion.
Problem
I have floated images and inset boxes at the top of a container using `float:right` (or `left`) many times. Now, I need to float a `div` to the bottom right corner of another `div` with the normal text wrap that you get with `float` (text wrapped above and to the left only). I thought this must be relatively easy even though `float` has no `bottom` value but I haven't been able to do it using a number of techniques and searching the web hasn't come up with anything other than using absolute positioning but this doesn't give the correct word wrap behaviour. I had thought this would be a very common design but apparently it isn't. If nobody has a suggestion I'll have to break my text up into separate boxes and align the `div` manually but that is rather precarious and I'd hate to have to do it on every page that needs it.