Hallo,

ich habe das Template Red Envy geladen und modifiziert ( anderes Headerbild, Schriftgrößen usw.) und nun noch ein Problem das mich in den Wahnsinn treibt.

Der Header besteht aus drei Teilen, der Top_nav Leiste mit integrierten Suchfeld
Dem Headerbild
Und der Main_nav Leiste für die Menüpunkte des Topmenues.

In allen gängigen Browsern wird die Seite wunderbar dargestellt, der einzige Browser der natürlich nicht will ist der IE. Der macht zwischen Header und Main_nav eine kleine Lücke von ein paar Pixeln und ich finde den Fehler einfach nicht wieso er das macht.

Im folgenden zwei kleine screenshots wie es sein sollte und wie es im IE angezeigt wird sowie mein CSS.

Vielen Dank schonmal im Voraus für Hilfe

So sollte es aussehen


So im IE


Hier die CSS
Code:
*{margin: 0;}
*{padding: 0;}

/**************************************** Main structure ****************************/

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
        background:#CCCCCC url(../images/bg_body.jpg) repeat-x left top;
        margin: 0;
        padding: 0;
	color:#333333;

}

a,
a:link,
a:active,
a:visited {
	text-decoration:none;
	color:#000000;
}

a:hover {
	text-decoration:underline;
	color:#3973AC;
}

#container {
	width: 842px;
        margin: auto;
	font-size: 1.2em;
}

#top_nav {
	background-image: url(../images/nav_top.jpg);
        height: 24px;
        margin: 0px;
        padding-bottom: 0px;
	padding-top: 15px;
	text-align: right;
	padding-right: 20px;
	color: #7E0200;
}
#header {
	background-image: url(../images/header.jpg);
        height: 170px;
        margin: 0px;
        padding: 0px;
}
#main_nav {
	background-image: url(../images/main_nav.jpg);
        height: 56px;
	padding-left: 9px;
        margin: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
}

#contentwrapper {
	background-image: url(../images/contentwrapper.jpg);
	background-repeat: repeat-y;
}

#left {
	float: left;
	width: 160px;
	padding-top: 20px;
        margin-top: 0px;
	margin-left: 15px!important;
	margin-left: 7px;
	font-size: 0.9em;
}

#right {
	float: right;
	width: 160px;
	padding-top: 20px;
	margin-right: 15px!important;
	margin-right: 7px;
	font-size: 0.9em;
}


#content {
	margin-right: 22%;
	margin-left: 200px;
        padding: 0px;
}


#footer {
	background-image: url(../images/footer.jpg);
	height: 35px;
	clear: both;
	text-align: center;
	padding-top: 20px;
}

/**************************************** text, ../images, lists ****************************/

img.float_left {
	float: right;
}

p {
	margin: 0px;
	padding: 0px;
}

p.topnav, .copyright {
	margin: 0;
        padding: 0;
}

h1 {
	color: #ffffff;
	padding-top: 110px;
	padding-left: 130px;
        padding-bottom: 0px;
	font-size: 3em;
	font-style: italic;
        margin-bottom: 90px;
}

h2 {
	font-size: 1em;
	color: #9A0500;
	background-image: url(../images/h2.jpg);
	background-repeat: repeat-x;
	height: 42px;
	padding-top: 3px;
	margin-bottom: 20px;
	padding-left: 8px;
}


h4 {

	font-size: 1em;
	height: 19px;
	width: 125px;
	color: #9A0500;
	padding-top: 3px;
	padding-left: 10px;
	padding-right: 24px;
}

dl {
	margin-top: 20px;
	margin-bottom: 20px;
}

dt {
	border-bottom: 1px solid white;
	padding: 3px;
	margin-bottom: 5px;
	background-image: url(../images/dt_bottom.gif);
	background-repeat: repeat-x;
	background-position: bottom;
}

dd {
	margin-bottom: 12px;
}

.news:first-letter {
	font-family: "Times New Roman", Times, serif;
	font-size: 1.2em;
	font-weight: bold;
}

/**************************************** Menu ****************************/

#navcontainer ul
{
	color: White;
	float: left;
	width: 100%;
	height: 54px;
}

#navcontainer ul li { display: inline; padding 0px;}

#navcontainer ul li a
{
	padding: 18px 1em;
	height: 18px;
	color: #720201;
	text-decoration: none;
	float: left;
	background-image: url(../images/menu_right_border.jpg);
	background-repeat: no-repeat;
	background-position: right top;
        margin: 0px;
}

#navcontainer ul li a:hover
{
	color: #fff;
	background-image: url(../images/menu_hover.jpg);
	background-repeat: repeat-x;
}

/**************************************** Contact form ****************************/

.button {
	border: 1px solid #D1D1C7;
	padding: 1px 8px;
	background: url(../images/button-bg.gif) top #EDEDE1;
	color: #666666;
}

.button:hover, .button:focus {
	border: 1px solid #A7A79F;
	color: #484848;
}
.inputbox {
	border: 1px solid #D1D1C7;
	background: #F7F6F0;
}

.inputbox:hover, .inputbox:focus {
	border: 1px solid #A7A79F;
}
form {
	margin: 0;
	padding: 0;
}

input, select {
	font: 12px/normal Arial, Helvetica, sans-serif;
}

select, .inputbox {
	padding: 2px;
}

/*--------------Joomla stuff----------------------------------*/
td,tr,p,div {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 130%;	
	font-size: 12px;	
	color: #484848;}

.componentheading {
	font-family: Arial, Helvetica, sans-serif;	
	font-weight: bold;	font-size: 2em;	
	color:#9A0500;}

.componentheading {  padding-top: 20px;}

.contentheading {  
	font-family: Arial, Helvetica, sans-serif;  	
	font-size: 20px;	
	font-weight: bold;
        padding-top: 20px; 
	vertical-align: bottom;	
	color:#990000;	
	text-align: left;}
.blockquote {
	padding: 15px 40px;
	background: url(../../images/quote.gif) 10px 10px no-repeat;
	font: italic 1em/1.5 Georgia, Times, serif;
}
.tips {
	padding-left: 22px;
	color: #CC7400;
	background: url(../../images/bullet-tips.gif) no-repeat top left;
}
.error {
	padding-left: 22px;
	color: #CC0000;
	background: url(../../images/bullet-error.gif) no-repeat top left;
}

.message {
	padding-left: 22px;
	color: #4D84A7;
	background: url(../../images/bullet-info.gif) no-repeat top left;
}
.highlight {
	border-bottom: 1px dotted;
	background: #F5F3DE;
	font-weight: bold;
}

td.sectiontableheader {
  background: #efefef;  
  color: #333;  
  font-weight: bold;  
  padding: 20px;  
  border-right: 1px solid #fff;}
  
tr.sectiontableentry1 td, tr.sectiontableentry2 td {  padding: 0px;}
td.sectiontableentry1, td.sectiontableentry2{  padding: 0px;}
table.contentpane, table.contentpaneopen {  width: 100%;}


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

a.mainlevel.nav {
	padding: 0px;
        margin: 0px;
	display: block;
	color: #5A5A5A;
	text-decoration: none;
	background: url(../../images/seperator.gif) repeat-x bottom;
}
a.mainlevel.nav:hover,
a.mainlevel.nav:active,
a.mainlevel.nav:focus,
a.mainlevel.nav#active_menu {
	background: url(../../images/seperator.gif) repeat-x bottom;
	color: #5A5A5A;
	text-decoration: none;
}
a.mainlevel#active_menu {
	color: #5A5A5A;
	text-decoration: bold;
}
.small {	
	font-size: 10px;	
	color: #999999;	
	font-weight: bold;	
	text-align: left;}
	
.modifydate {   
	vertical-align: bottom;	
	font-size: 10px;	
	color: #999999;	
	font-weight: bold;	
	text-align: left;}
	
.createdate {	
	vertical-align: top;	
	font-size: 16px;	
	color: #999;	
	font-weight: bold;	
	vertical-align: top;	
	padding-bottom: 10px;	
	padding-top: 0px;}
	
.clr {	clear: both;}

div.mosimage_caption {  
	font-size: 12px;  
	color:#333333;}
	
div.center {  text-align: center;}

table.moduletable th { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color:#FFFFFF;
		height: 19px;
	width: 159px;
	padding-bottom: 7px;
		background:  url(../images/sidebar_heading.png) no-repeat;
}

table.moduletable { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	padding-bottom: 7px;
}
Edit: hab den Fehler gefunden: Im Div header in der index.php des Templates wird der Seitename genommen und auf das Headerbild projeziert. Dies interpretiert der IE6 und IIE7 aber nicht richtig und machen eine Lücke zwischen den Projezierten Seitenamen und die navleiste. Deswegen diese Funktion einfach löschen und den Seitenamen bei Wunsch einfach direkt auf den Header "malen" dann stimmen die Abstände wieder und man hat den gleichen Effect.