Click to See Complete Forum and Search --> : Aligning Images in a Cell


axys
08-04-2005, 07:11 AM
Hi,

I have a cell with an image, then some text, then another image:



<table border=1 cellpadding=0 cellspacing=0>
<tr>
<td valign=top>
<img src=artist.gif><br>
Artist<br>
Prod Name <br>
<img src=free.gif>
</td>
</tr>
</table>



I want it so the top image is always aligned to the top of the cell and the bottom image is always aligned to the bottom. I've tried various things with html and css but can't seem to achieve this.

Any Ideas

deep.dhyani
08-04-2005, 07:19 AM
use this code:

<table border=0 cellpadding=0 cellspacing=0 width="600" height="100%" style="border:1px black solid">
<tr align=top>
<td valign=top>
<img src=artist.gif><br>
Artist<br>
Prod Name <br>
</td>
</tr>
<tr>
<td valign=top width="*">

</td>
</tr>
<tr valign=bottom>
<td>
<img src=free.gif>
</td>
</tr>

</table>

axys
08-04-2005, 08:47 AM
I have to do it in one cell because of the way the code is generated.

NogDog
08-04-2005, 09:10 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang='en'>
<head>
<META HTTP-EQUIV='Content-Type' CONTENT='text/html; charset=ISO-8859-1'>
<title>Page title</title>
<style type="text/css">
<!--
td img {
display: block;
margin: 0;
padding: 0;
}
td p {
margin: 0.5em;
padding: 0;
}
-->
</style>
</head>
<body>
<table border=1 cellpadding=0 cellspacing=0>
<tr>
<td valign=top>
<img src=artist.gif width="150" height="100" alt="Alt Text">
<p>Artist</p>
<p>Prod Name</p>
<img src=free.gif width="150" height="100" alt="Alt Text">
</td>
</tr>
</table></body>
</html>