[thelist] Aligning an image to the bottom of multiple lines of text in CSS
Maximillian Schwanekamp
lists at neptunewebworks.com
Tue Oct 19 03:23:26 CDT 2004
Roger Ly wrote:
>I can't seem to get any good alignment going.
>
>
How about modifying the markup to give elements ids or classes, like:
<div id="container">
<img id="myimage" src="yada.gif" alt="yada" />
<div id="inner"> blah blah
</div>
</div>
CSS:
#container { position: relative; width: 500px; height:200px; border: 1px
solid #ccc; }
#myimage { position: absolute; bottom: 0; left: 0; }
#inner { position: absolute; right: 0; bottom: 0; width: 350px; }
Is that approaching what you're after? If you need #container to be an
arbitrary height according to the amount of content, you could use
floats instead, and add a "clearing element":
How about modifying the markup to give elements ids or classes, like:
<div id="container">
<img id="myimage" src="yada.gif" alt="yada" />
<div id="inner"> blah blah
</div>
<div class="clearing"></div>
</div>
#container {border: 1px solid #ccc; width: 500px; }
#myimage { float: left; margin: 0 1em;}
#inner { float: right; width: 350px; }
.clearing { clear: both; }
--
Maximillian Von Schwanekamp
Dynamic Websites and E-Commerce
NeptuneWebworks.com <http://www.neptunewebworks.com/>
voice: 541-302-1438
fax: 208-730-6504
More information about the thelist
mailing list