What am i doing wrong here
http://spandog.com/trials/indextop.html
clicking the FACTS link I want 7 dropdowm items to show but the extra item goes onto a new line.
It works fine for ABOUT and SERVICES but as I have more (7)dropdown links than in the top link bar this causes a problem that I cant solve
Have tried position absolute and relative but cant get iot to work out right
the script is on
http://spandog.com/trials/styletop2.css
/* CSS Document */
body{padding:0px; margin:0px; background:#666633 url('images/mainbg.jpg') repeat-x 0 0; color:#707070; font-style:normal; font-variant:normal; font-weight:normal; line-height:18px; font-size:14px; font-family:Trebuchet MS, Arial, Helvetica, sans-serif}
div, p, ul, h2, h3, img{padding:0px; margin:0px;}
ul{list-style-type:none;}
/*----TOP PANEL----*/
#topPan{width:900px; height:152px; position:relative; margin:0 auto; padding:0px;}
#topPan ul{width:480px; height:32px; position:absolute; top:76px; right:0px;}
#topPan ul li{float:left; width:79px; height:32px; padding:0 0 0 1px;}
#topPan ul li a{display:block; width:79px; height:32px; background:#7E7B00 url('images/menubg-normal.gif') no-repeat 0 0; color:#656565; font-size:11px; font-weight:bold; line-height:32px; text-transform:uppercase; text-align:center; text-decoration:none}
#topPan ul li a:hover{background:#7E7B00 url('images/menubg-hover.gif') no-repeat 0 0; color:#7C7900; text-decoration:none}
#topPan ul li.home{display:block; width:79px; height:32px; background:#7E7B00 url('images/menubg-hover.gif') no-repeat 0 0; font-size:11px; font-weight:bold; line-height:32px; color:#7C7900; text-decoration:none; text-transform:uppercase; text-align:center}
#topPan ul.dropdown{width:480px; height:22px; position:absolute; top:119px; right:0px;}
#topPan ul.dropdown li{float:left; width:79px; height:22px; }
#topPan ul.dropdown li a{display:block; width:79px;background:#fff url('images/vertical-dot.gif') no-repeat 100% 0; color:#3E3E3E; font-size:11px; text-decoration:none; text-align:center; line-height:22px}
#topPan ul.dropdown li a:hover{text-decoration:none; background:#fff url('images/vertical-dot.gif') no-repeat 100% 0; color:#7C7900}
#topPan ul.dropdown li.verticallinenone a{display:block; width:79px;background:#fff; color:#3E3E3E; font-size:11px; text-decoration:none; text-align:center; line-height:22px;}
#topPan ul.dropdown li.verticallinenone a:hover{text-decoration:none; background:#fff; color:#7C7900;}
/*----/TOP PANEL----*/
/*----BODY TOP PANEL----*/
#bodytopmainPan{width:100%; background:#F4F4F4; color:#8D8D8D; float:left; padding:15px 0 0; clear:both;}
#bodytopPan{width:900px; position:relative; background:#F4F4F4; color:#707070; margin:0 auto; padding:0px;}
#bodytopPan h2{background:#F4F4F4; color:#6E6C00; font-size:24px; height:70px; line-height:70px;}
#bodytopPan p{padding:0 38px 11px 0;}
#bodytopPan p span{font-weight:bold;}
......etc
can anyone help with this
thanks
