There must be an easier way

[Jim S]

On all the pages of www.priorysingers.org.uk the 'buttons' on the left is 7
1x1 tables inside the cells of a 7x1 (Or is it 1x7) table inside the table
which makes up the main page.
There must be an easier/slicker/more acceptable way of doing this using css,
but my way is the only way I know to keep everything exactly in the right
place in all browsers.
Can anyone help or point me to understandable rehab.

 

[=?iso-8859-1?Q?Kim_Andr=E9_Aker=F8?=]

On all the pages of www.priorysingers.org.uk the 'buttons' on the
left is 7 1x1 tables inside the cells of a 7x1 (Or is it 1x7) table
inside the table which makes up the main page.
There must be an easier/slicker/more acceptable way of doing this
using css, but my way is the only way I know to keep everything
exactly in the right place in all browsers.
Can anyone help or point me to understandable rehab.

Sure thing. In your stylesheet, do something like this:

div.navbutton {
width: 100px; height: 40px; background: #dcdcdc;
border: 3px ridge silver; font-size: 85%; font-weight: bold;
font-family: Arial, sans-serif;
}
div.navbutton a:link,hover,visited,active { text-decoration: none; }

And in your HTML code:

<div class="navbutton"><a href="index.html">Home</a></div>

Which replaces the following from your source code:

<tr>
<td align="center">
<table style="border-collapse: collapse;" id="AutoNumber2"
bgcolor="#dcdcdc" border="3" cellpadding="2" cellspacing="0">
<tr>
<td height="40" width="100">
<p align="center"><b><font face="Arial" size="2">
<a href="http://www.priorysingers.org.uk/index.html"
style="text-decoration: none;">Home</a></font></b></p>
</td>
</tr>
</table>
</td>
</tr>

When it comes to vertically centering the text, look at this:
http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

 

[Bergamot]

On all the pages of www.priorysingers.org.uk the 'buttons' on the left is 7
1x1 tables inside the cells of a 7x1 (Or is it 1x7) table inside the table
which makes up the main page.
There must be an easier/slicker/more acceptable way of doing this using css,

For navigation menus, tables are out. Lists are in.
http://css.maxdesign.com.au/listamatic/

 

[John Hosking]

For navigation menus, tables are out. Lists are in.
http://css.maxdesign.com.au/listamatic/

Yes, nav-link list items are the new "black" ;-)