Hi There, Just use a background image for the nav border. I made one that was 760x20 with no repeat, but it could even be 1x1 and repeat y. Just position it at the bottom.
You can look at the page here: http://www.manisheriar.com/wsg/borderOrder/ Here's the code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <title>Border Order</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css" media="screen"> /* this is the ul */ #navlist {float:left;width:760px;padding:4px 0;margin:0;font: bold 12px Verdana, sans-serif;background:#EBEBEB url(bottomBorder.gif) no-repeat bottom;} #navlist li {display:inline;list-style:none;margin:0;padding:0;} #navlist li a:link, #navlist li a:visited {color:#737577;padding:3px 0.5em;margin-left:3px;border-bottom:none;text-decoration: none;} #navlist li a:hover {color:#fff;background:#737577; border-color:#BCBEC0;} #navlist li a#current {color:#A11D55;border:1px solid #BCBEC0;background:#fff;border-bottom:2px solid #fff;} </style> </head> <body style="background:#fff"> <ul id="navlist"> <li id="active"><a href="#" id="current">Home</a></li> <li><a href="#">News & Media</a></li> <li><a href="#">Members</a></li> <li><a href="#">Products & Services</a></li> <li><a href="#">About PIR</a></li> <li><a href="#">FAQ</a></li> </ul> </body> </html> Mani Sheriar Sheriar Designs | www.ManiSheriar.com 925|914.0741 � �� ****************************************************** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
