Tables provide one means of arranging materials in an html document. They are especially useful for (a) placing text next to an image, or (b) arranging images. The one problem is that they require a lot of tagging, and a single typographical error can make the table a mess or even render the page invisible.
Avoiding Tables
Since tables require many commands and simple typos can create a mess, we have replaced many of our two column tables (such as those that place two images side) by side with the following. Remember, you will have to adjust the height until it looks right, and that can take several tries.
<center><a href="xxx.html"><img src="xxx.jpg" height="300" hspace="5" border="0"/></a>
<a href="xxx.html"><img src="xxx.jpg" height="300" hspace="5" border="0"/></a>>
</center>
<p class="tc">Left: <span class="tcartwork"></span>. Right: <span class="tcartwork"></span>. [Click on images to enlarge them.]</p>
The following will align three images and provide formatting for captions.
<center>><a href="xxx.html"><img src="xxx.jpg" height="180" hspace="5" border="0"/>
<a href="xxx.html"> <img src="xxx.jpg" height="180" hspace="5" border="0"/>
<a href="xxx.html"> <img src="xxx.jpg" height="180" hspace="5" border="0"/>
</center>
<p class="tc">Left: <span class="tcartwork"></span>. Middle: <span class="tcartwork"></span>. Right: <span class="tcartwork"></span>. [Click on images to enlarge them.]</p>
A Two-Column Table -- useful for long lists of authors, artists, works, and so on
For an example of such a large double-column table, see the following. The html below shows only the beginning and the end of this table.
<table border ="0" cellspacing= "5" width="670" cellpadding="5">
<tr>
<td width="50%" valign="top" width="50%">
<a href="intro.html">Introduction to the Novels</a>
</td>
</tr>
<tr>
<li><a href="diniejko10.html">A Quest for the Eternal Feminine Ideal in <span class ="book">The Well-Beloved</span> </a></li>
<li><a href="../../art/illustration/paget/pva217.html">Paget's illustrations with commentaries</a></li> </td>
</tr>
</table>
A Four-Column Table -- useful for arranging images
[To see how this table appears look at the document in the Victorian Web. The material below shows only the first row.]
<center>
<table border ="0" cellspacing= "6" cellpadding="6">
<tr>
<td>
<center>
< a href="../leighton/leighton1.html"> <img src="../leighton/leighton1a.jpg" > </a>
</center>
</td>
<td>
<center>
<a href="../leighton/leighton2.html"> <img src="../leighton/athlete2a.jpg" > </a>
</center>
</td>
<td>
<center>
<a href="../gilbert/gilbert2.html"> <img src="../gilbert/gilbert2a.jpg" > </a>
</center>
</td>
<td>
<center>
<a href="../gilbert/gilbert3.html"> <img src="../gilbert/gilbert3a.jpg" > </a>
</center>
</td>
</tr>
</table>
</center>
Last modified 17 January 2021