How to remove separation line from menu button

Akos · #1 (**permalink**) 02-20-10, 04:40 AM

http://img168.imageshack.us/img168/9330/menuzv.jpg

The image above is taken from my website. This is a button in the menu. When updated, I added this new button to my template.

Problem is that I cannot remove the last separation vertical line from design. It is a CSS HTML. When change button width this last one drop down to next row if I go too wide.

Any idea to resolve this?

Thanks,
norD

Nico · #2 (**permalink**) 02-20-10, 04:44 AM

Please post your code.

Akos · #3 (**permalink**) 02-20-10, 04:58 AM

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
[url=http://www.freecsstemplates.org]Download free CSS templates - Free CSS Templates[/url]
Released for free under a Creative Commons Attribution 2.5 License

Name       : Bamboo  
Description: A two-column, fixed-width design with dark color scheme.
Version    : 1.0
Released   : 20090820

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="shortcut icon" href="http://www.3leaves-label.com/favicon.ico" >
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>3LEAVES //sound adventures at your home</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
	<div id="header-wrapper">
	<div id="header">
		<div id="logo">
			<h1><a href="#">3leaves   </a></h1>
			<p> //sound adventures at your home</p>
		</div>
	</div>
	</div>
	<!-- end #header -->
	<div id="menu">
	  <ul>
			<li class="current_page_item"><a href="index.html">Home</a></li>
			<li><a href="artists.html">Artists</a></li>
			<li><a href="releases.html">Releases</a></li>
			<li><a href="distribution.html">Distribution</a></li>
			<li><a href="press.html">Press</a></li>
		</ul>
	  <ul>
	    <li><a href="http://3leaves-label.com/zen_cart/">Webshop</a></li>
      </ul>
	</div>
	<!-- end #menu -->
	<div id="page">
	<div id="page-bgtop">
	<div id="page-bgbtm">
		<div id="content">
			<div class="post">
				<h3 class="title"><a href="#">NEW RELEASE IS OUT!</a></h3>
              <p class="meta">Posted by <a href="mailto:info@3leaves-label.com" target="_blank">Ákos Garai</a> on 15th February, 2010 				</p>
	            <div class="entry">
				  <p align="left">We are proud to announce our second release <strong>Habitats</strong> by   German artist, founder member of the <a href="http://www.gruenrekorder.de" target="_blank">Gruenrekorder</a> label <em>Lasse-Marc Riek</em>. </p>
                <p align="left">The edition contains two discs: one for audio composition that opens with   Riek's introductory spoken word, and the other, which presents <strong>Habitats   from Finland</strong>, a slideshow video that based on photographs by <em>Anne-Berit Riek</em>.</p>
                <p align="left">Artwork printed in B6 size folded sleeve. 150 hand-numbered copies was   manufactured. </p>
                <p align="left">We are present you the release packaged in crystal clear sealable Daiso bag   with great pleasure. For further details please see page &quot;Releases', if you wish to   order, drop around our <strong>Webshop</strong>.</p>
              </div>
			</div>
</div>
		<!-- end #content -->
		<!-- end #sidebar -->
		<div style="clear: both;"></div>
	</div>
	</div>
	</div>
	<!-- end #page -->
</div>
<div id="footer-wrapper">
	<div id="footer">
		<p>(c) 2010 3leaves-label.com. powered by <a href="http://www.hosting24.com">hosting24.com</a>. Design based on <a href="http://www.freecsstemplates.org/" target="_blank">Free CSS Templates</a>.</p>
	</div>
	<!-- end #footer -->
</div>
</body>
</html>

wirehopper · #4 (**permalink**) 02-20-10, 10:36 AM

Put an id on the last element on the menu and suppress the border.

Akos · #5 (**permalink**) 02-20-10, 10:59 AM

Quote:

Originally Posted by wirehopper

Put an id on the last element on the menu and suppress the border.

Could you please do a favour for me and paste the edited code here?

CodeRobber · #6 (**permalink**) 02-25-10, 05:57 AM

Hi There,

What you could do is simple add a class or id to that final menu item like wirehopper said.

Try

<ul>
<li class="lastitem"><a href="http://3leaves-label.com/zen_cart/">Webshop</a></li>
</ul>

Then in your CSS simply style it like .lastitem { border: 0px; }

or something similar