Html Help

[Lenna]

I'm trying to Align 3 images on one row, 2 are small, the 3rd one is long and in the center.

The way the table is set out, is like this (this is only one part of the table) (I've taken out the <'s as it's messing up this thread :))

table width="100%" height="3" align="center" border="1" bordercolor="#336699"
tr
td
img src="http://www.image.com/img.gif" height="50" width="50" alt="" align="left" /
center img src="http://www.image.com/img.gif" alt="" height="99" width="579" / /center
img src="http://www.image.com/img.gif" height="50" width="50" align="right" alt="" /
center font size="1" Images /font /center
/td
/tr

When I try to put them all onto the same line, the 2 succeed, the 3rd one goes onto the second line, although from what I see, there's a huge gap at the end big enough to fit that picture at the end of the first line.

Any idea's?

[Dr Unne]

It would be easier if you posted this bit of HTML to a public server so we could see it in action. (Once upon a time, some old crotchety ex-admin messed with the PHP so that the [code&#93; tags used to HTML-escape &lt; so that HTML could be posted easily, but vBulletin upgrades have reverted it back to default behavior... *cough*)

If you're using tables to try to align images as part of a site's layout, consider using CSS instead. This is what CSS is designed for. Table width (for example) is often not strictly observed by all browsers, but only taken as a suggestion. CSS also has the advantage that everything doesn't have to fit into same-sized rows and columns.

[rubah]

I don't think you can use the center tag inside tables.

You also need to end your table.
I don't think you can use the center tag inside tables.

You also need to end your table.

&lt;table width="100%" height="3" border="1" rules="none" bordercolor="#336699"&gt;
&lt;tr&gt;&lt;td align="left" width="50px"&gt;&lt;img src="http://www.image.com/img.gif" height="50" width="50" alt="yayya"/&gt;&lt;/td&gt;
&lt;td align="center"&gt;&lt;img src="http://www.image.com/img.gif" alt="rararara" height="99" width="579" /&gt;&lt;/td&gt;
&lt;td align="right" width="50px"&gt;&lt;img src="http://www.image.com/img.gif" height="50px" width="50px" alt="shishushush" /&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;
&lt;td>&lt;/td&gt;
&lt;td align="center">&lt;font size="1"&gt; Images &lt;/font&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
<table width="100%" height="3" border="1" rules="none" bordercolor="#336699">
<tr><td align="left" width="50px"><img src="http://www.image.com/img.gif" height="50" width="50" alt="yayya"/></td>
<td align="center"><img src="http://www.image.com/img.gif" alt="rararara" height="99" width="579" /></td>
<td align="right" width="50px"><img src="http://www.image.com/img.gif" height="50px" width="50px" alt="shishushush" /></td></tr>
<tr>
<td></td>
<td align="center"><font size="1"> Images </font></td></tr>
</table>

[bipper]

You can use center inside a table, depending on your browser. Most browser's will accept it, I think it may not even hinder standard compliance with w3c.

The problem you have will have to simply be solved by makeing new columns. One picture per column. If you try centering an element, it will whore up every thing to the right side of it in most browsers. so each image will be in a new table data cell. Make sence? (Rubah did this in her example)

If you are using tables for layouts, and this will futz up your page, just use the colspan = (number, however many columns you want your cell to span) propterty.



If you're using tables to try to align images as part of a site's layout, consider using CSS instead. This is what CSS is designed for. Table width (for example) is often not strictly observed by all browsers, but only taken as a suggestion. CSS also has the advantage that everything doesn't have to fit into same-sized rows and columns

Quoted for truth. Even though it goes agains the table revolution, and kaiserDragon will destroy us both.
bipper