Navigation Menu / Top Menu Expand

i'm using coda alter code photoshop (.psd) layout.

i've attached image guidance along few lines of code can me with.

want add 6th menu on list keeps scrunching page , pushing else down.

page:

code:

<div id="container">    <div id="main_panel">      <div class="main_center">        <div id="main_top_panel">          <div id="main_top_logo_panel">            <div class="logo">              <h1><a href="#"><img src="images/plantoolslogocopy.jpg" alt="" border="0" /></a></h1>            </div>          </div>          <div id="navigation_panel">            <div id="topmenu">                            <ul>                  <li><a href="index.html"><span>home</span> </a></li>                  <li><a href="about.html" class="over"><span>about</span></a></li>                  <li><a href="services.html"><span>solutions</span></a></li>                  <li><a href="support.html"><span>alliance partners</span></a></li>                  <li><a href="news.html"> <span>news</span></a></li>                  <li><a href="resources.html"> <span>resources</span></a></li>                  <li style=" background:none;"><li><a href="contact-us.html"><span> contact</span></a></li>               </ul>                            <div class="clear"></div>            </div>

css:

code:

#main_panel {clear:both;}  #main_top_panel { clear:both;}  #main_top_panel { clear:both; height:65px; 	 }   #main_top_logo_panel {float:left; width:250px;}  .logo {margin:0px; padding:10px 0px 0px 0px; float:left;}  .logo h1{margin:0px; padding:0px; font-size:26px; font-weight:normal; color:#000;}      #navigation_panel {float:right; width:530px;}  #topmenu { margin:0px; padding:30px 0px 0px 0px; }  #topmenu ul {margin:0px; padding:0px;}    #topmenu ul li { display:block; float:left;  background:url(../images/nav_line.gif) right  no-repeat;	list-style:none;}    #topmenu li {  	font:bold 12px arial, helvetica, sans-serif;  	color:#9199a7;  	text-decoration:none;  	text-transform:capitalize;  	display:block;   	float:left; 	  	  	padding:0px 1px 0px 2px;  }    #topmenu li span {  	display:block;  	float:left;  	padding:10px 20px 10px 20px;   	cursor:pointer;  	  }

 

attached files:

• 

  correct.png

  file size:

  199.8 kb

  views:

  39

• 

  wrong.png

  file size:

  202.4 kb

  views:

  37

as can see in 2nd image pushed down. anyway allow 6,7 , 8th menu item without pushing down? looking make clean bar way across.

 

Forums Special Interests Web Design and Development

• iPhone
• Mac OS & System Software
• iPad
• Apple Watch
• Notebooks
• iTunes
• Apple ID
• iCloud
• Desktop Computers
• Apple Music
• Professional Applications
• iPod
• iWork
• Apple TV
• iLife
• Wireless