Making an Image Gallery

Here are the skeletal codes to make a gallery showing 4 images across. Each small image that shows in the table is a link to the full sized image.

The caption tag will be the title of the table or gallery and won't look like it's in a table.

Each image will have a nice space around it the same color as the page bg, unless you put a different color in the table tag.

Under each image will be its title.

Notice that the td width is specified only in the first row of 4 tds. These set the widths for all the rest of the td rows.

TITLE OF GALLERY

Title 1	Title 2	Title 3	Title 4
Title 5	Title 6	Title 7	Title 8

<table width="520" border="0" cellpacing="0" cellpadding="5"> <caption>TITLE OF GALLERY</caption> <!-- first row of images --> <tr><td width="120" height="120"> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td> <td width="120"> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td> <td width="120"> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td> <td width="120"> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td></tr> <!-- row for image titles for above row --> <tr><td align="center">Title 1</td> <td align="center">Title 2</td> <td align="center">Title 3</td> <td align="center">Title 4</td></tr> <!-- row 2 of images --> <tr><td height="120"> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td> <td> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td> <td> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td> <td> <a href="url of large image"> <img src="url of small image" width="120" height="120" border="0" /></a></td></tr> <!-- row for image titles for above row --> <tr><td align="center">Title 5</td> <td align="center">Title 6</td> <td align="center">Title 7</td> <td align="center">Title 8</td></tr></table>

Here's an example - this page is an imaging tute I wrote. Each example of 4 images plus the titles under them is one complete table.