[thelist] Aligning an image to the bottom of multiple lines of text in CSS

[Roger Ly]

Hey all,

Any thoughts on how to accomplish the following with CSS and no tables?


=============================

----
|  |
|  |
|  | this is some text
|  | that is aligned to
|  | the bottom of an image.
---- how to do this?

www.mydomain.com

==============================

There is an image on the left, which is vertically aligned to the bottom
of the multi-line text on its right.  Directly underneath both, is a
link which is aligned to the left of the image.  Both the image and the
link need to be hyperlinked.

I can't seem to get any good alignment going.

The best thing I could come up with was something like this:

<div style="background-image: url(http://url.to.image);
background-position: bottom left; background-repeat: no-repeat;">	
	<!-- the padding should be the width of the image plus some
padding pixels !-->
	<div style="padding-left: 150px; ">
		blah blah blah<br />
		blah blah blah<br />
		blah blah blah<br />
		blah blah blah<br />
		blah blah blah<br />
	</div>
</div>
<div><a href="http://www.mydomain.com">www.homestead.com</a></div>

But I don't know how I'd get the image to be hyperlinked.

Any ideas?

TIA

Roger