Border unterm butten weg bekommen

[Sascha1976]

Hallo,
ich habe eine Navigation und möchte den Strich unter Startseite gerne weg bekommen. Bei allen anderen Buttons soll er so bleiben. Zur vereinfacherung habe ich mal ein Bild angehangen.

Anbei noch der CSS und HTML Code.

Schonmal danke für eure Hilfe.

Gruß
Sascha

CSS

#headerwrap {
	text-align: center;
	width: 100%;
	background: #FFFFFF;
       position: absolute -1px;
}

#header {
	margin: 0 auto;
	width: 950px;
	text-align: left;
	line-height: normal;
}

#header h1 {
	font-size: 2em;
	height: 100px;
}

#header h1 img {
	float: left;
}

#mainnav {
	font-size: 1em;
	font-weight: bold;
	line-height: normal;
	clear: both;
	float: left;
}

#subnavwrap {
       padding-top: 8px;
	text-align: center;
	width: 100%;
	float: left;
	background: #F3F9E1;
       border-top:1px solid #679a01;
       border-bottom:1px solid #6c0;
       height: 35px;
	vertical-align: middle;
}

#splitmenu {
}

#splitmenu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#splitmenu li {
	margin: 0;
	padding: 0;
	display: inline;
}

#splitmenu a {
	float: left;
	margin: 0 2px;
	padding: 0 0 0 4px;
	background: url(../images/tab_left.png) no-repeat top left;
	text-decoration: none;
	text-align: center;
}

#splitmenu a:hover,
#splitmenu a:active,
#splitmenu a:focus {
}

#splitmenu a span {
	float: left;
	padding: 7px 15px 6px 11px;
	display: block;
	background: url(../images/tab_right.png) no-repeat top right;
	color: #FFFFFF;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#splitmenu a span {
	float: none;
}
/* End IE5-Mac hack */

#splitmenu a:hover span {
	color: #FFFFFF;
}

#splitmenu li.active_menu a,
#splitmenu li.active_menu a:hover,
#splitmenu li.active_menu a:active,
#splitmenu li.active_menu a:focus {
	background: url(../images/tab_left-on.png) no-repeat left top;
}

#splitmenu li.active_menu a span,
#splitmenu li.active_menu a:hover span,
#splitmenu li.active_menu a:active span,
#splitmenu li.active_menu a:focus span {
	background: url(../images/tab_right-on.png) no-repeat right top;
	color: #6c0;
}

HTML

<div id="headerwrap">
<div id="header" class="clearfix">

<h1><a href="index.html"><img src="/images/logo.jpg" alt="{$conf.NAME}" /></a></h1>

<div id="mainnav">
<ul id="splitmenu" class="mainlevel">
<li class="active_menu"><a href="{$conf.HTTP_SERVER}" title="Startseite"><span>Startseite</span></a></li>
<li><a href="{$conf.HTTP_SERVER}" title="Frage stellen"><span>Frage stellen</span></a></li>
<li><a href="{$conf.HTTP_SERVER}" title="Neue Fragen"><span>Neue Fragen</span></a></li>
<li><a href="{$conf.HTTP_SERVER}" title="Gute Fragen"><span>Gute Fragen</span></a></li>
<li><a href="{$conf.HTTP_SERVER}" title="Offene Fragen"><span>Offene Fragen</span></a></li>
<li><a href="{$conf.HTTP_SERVER}" title="Neue Antworten"><span>Neue Antworten</span></a></li>
</ul>
</div> <!-- //MAINNAV -->


</div> <!-- //HEADER -->
</div> <!-- //HEADERWRAP -->


<div id="subnavwrap">
<input id="header-navigation-search-searchTerms" name="search_value"  type="text" size="45" style="width:350px;height:15px;padding:4px;" />
<input type="submit" value="Finden" />
</div> <!-- //SUBNAVWRAP -->

 

[Maik]

Hi,

schau dir mal die Formatierung für ein Tab-Menü anhand des Beispiels http://css.maxdesign.com.au/listamatic/horizontal08.htm an, oder du orientierst dich wegen der grafischen Umsetzung der Tabs an den "Sliding Doors", siehe Example 8a.

mfg Maik