Change ul#nav a to
{ width:15%; display:block; float:left; padding:6px 21px; text-decoration:none; color:#ffffff; background-color:#C80000; text-align: center;}
I tried it with five links in the menu expecting 100%/5 to be 20% each but it didn't work. I had to reduce % to 15% and I'm not sure why; probably the padding of 21px in each. Temporarily add border: 1px solid to see the spacing. The end one may appear to be not reaching the end, but that may be a combination of the padding and that text is aligned left so a larger space appears to the right. I added text-align: center to spread them out within each space.
The principle is OK though, it spreads out the links over the menu whatever the screen resolution, except if the screen gets too small for them when the end one will flip down.
---------
Changing to width:19.7% and padding:6px 0px also works for five links. 20% probably not possible because of body margins. (Decimal points can be used for percentages).
Last edited by Wickham; 20 May 2006 at 04:48 AM.
Code downloaded to my PC will be deleted in due course.
WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.