CSS greift falsch bei IE7

Status
Nicht offen für weitere Antworten.

hunde1

Grünschnabel
Hi leute,

habe ein Problem mit meinem CSS..
Es geht um ein Menü.
hier mal der code:

Head bereich:


HTML:
<script type=\"text/javascript\">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=15; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script>



<style type=\"text/css\">
<!-- 

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
background:#2159bd;
}

#menu_rand{
padding:0; 
border:1px solid #888; 
margin-top: 20px;
margin-left: 10px;
list-style:none; 
width:180px; 
height:300px; 
float: left; 

}

dl#menu {
margin-top:-1px;


}



dl#menu dt {
cursor: pointer;
margin: 1px 1px;
height: 100%;
line-height: 20px;
text-align: left;
font-weight: bold;



}
dl#menu dd {
border: 0 none;

}
dl#menu li {
text-align: left;
background: #fff;
margin: 1px 1px;
line-height: 20px;
border: 0 none;

list-style:none;

}
dl#menu li a, dl#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;

}

dl#menu li a:hover
{
background: red;
color: #FFFFFF;
}

dl#menu dt a:hover {

color: #FFFFFF;
}

-->
</style>

Body Bereich
HTML:
<!-- menue start -->  
<div id=\"menu_rand\">
      <dl id=\"menu\">

		<dt onclick=\"javascript:montre('smenu1');\"><a href=\"#\">&nbsp;Menu1</a></dt>
			<dd id=\"smenu1\">
				<ul>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>


				</ul>
			</dd>		
</dl>   
  </div>

  
	<!-- menue ende -->

wenn ich das im Firefox anschaue passt alles.
sobald ich aber das im IE7 anguge.. is das ding rießen groß.. da passt gar nichts mehr.
kann mir jemand helfen?
Danke schon mal...

grüße..

Andy
 
ah sry hab ich vergessen weg zu machen..
das ist ne php datei... desswegen die viellen \"

hat jemand eine idee warum das so ist das es im IE so angezeigt wird?
 
Also wenn ich eine seperate PHP-Datei in dieser Form habe

PHP:
<?php
echo" ... ";
?>
, die ich über include() in das Hauptdokument lade, muß ich alle darin enthaltenden Anführungszeichen Escapen, da ich ansonsten mit PHP-Fehlermeldungen bombadiert werden würde.

mfg Maik
 
PHP ist aber eine eingebettete Sprache, das heißt der PHP-Code kann in anderen Code eingebettet werden. Und da in genanntem HTML-Code keinerlei PHP-Code vorkommt, ist es sinnlos, diesen nicht direkt auszugeben, also ohne den Umweg über PHP.
 
Die Ursache hab ich mal rot markiert:
Code:
dl#menu dt {
cursor: pointer;
margin: 1px 1px;
height: 100%;
line-height: 20px;
text-align: left;
font-weight: bold;
}



dl#menu li a, dl#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;

}
Wenn ich diese Angaben auskommentiere, oder entferne, stimmt die Darstellung im IE (6 + 7) mit der im Firefox überein.

mfg Maik
 
thx des hat hin gehauen.
habs bisschen jetzt noch verändert..
jetzt hab ich aber noch ein kleines problem..

hiermal der code nochmals..

HTML:
<style type=\"text/css\">
<!-- 

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;

}
#menu_border{
width:180px; 
height:300px; 
border:1px solid #888; 
float:left;
margin-top: 20px;
margin-left: 10px;

}


dl#menu {
width: 180px;
background:#2159bd;
margin-left:0,5px;

}
dl#menu dt {
cursor: pointer;
margin: 1px 1px;
line-height: 20px;
text-align: left;
font-weight: bold;
border-left: 4px solid red;
background:#2159bd;
}
dl#menu dd {
border: 0 none;
}
dl#menu li {
text-align: left;
background: #fff;
margin: 1px 1px;
line-height: 20px;
border: 0 none;
border-left: 4px solid green;

}
dl#menu li a, dl#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;


}
dl#menu li a:hover
{
background: red;
color: #FFFFFF;
}

dl#menu dt a:hover {
color: #FFFFFF;
}

-->
</style>

HTML:
<div id=\"menu_border\">
<dl id=\"menu\">

		<dt onclick=\"javascript:montre('smenu1');\"><a href=\"#\">&nbsp;Menu1</a></dt>
			<dd id=\"smenu1\">
				<ul>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
				</ul>
			</dd>	
			
		<dt onclick=\"javascript:montre('smenu2');\"><a href=\"#\">&nbsp;Menu2</a></dt>
			<dd id=\"smenu2\">
				<ul>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
					<li><a href=\"#\">&nbsp;Unterpunkt1</a></li>
				</ul>
			</dd>	
</dl>
</div>

ich will jetzt unter dl#menu den background weg machen und unter dl#menu dt { einfügen..
das nur das obermenü diese farbe hat.. wenn ich das so lasse, sind die ramen in den untermenüs mit der gleichen backgroundfarbe.. ich will dort einfach weis..
füre ich nun das ganze unter dl#menu dt{
ein und nims oben raus.. dann t das zwar für beide browser aber..
im ie erscheint nur noch eine hand wenn ich über den text fahre.. sprich menu1.. will
aber das die ganze spalte als hyperlink gild.. beim firefox geht das.. da kann ich irgendwo
hin klicken in den ersten oberpunkt.. beim ie nicht mehr.. das ist bestimmt nur eine kleinigkeit oder?

grüße und danke an alle!
 
Wenn ich deine "schwammigen" Ausführungen jetzt richtig deute, sollte dir das hier weiterhelfen:

Code:
dl#menu {
width: 180px;
/*background:#2159bd;*/
margin-left:0 5px;
}

dl#menu li {
text-align: left;
background: #fff;
margin: 1px 1px;
line-height: 20px;
border: 0 none;
/*border-left: 4px solid green;*/

}
dl#menu li a, dl#menu dt a {
color: #000;
text-decoration: none;
display: block;
border: 0 none;
width:100%;
}
Und achte doch bitte in deinen Beiträgen etwas mehr auf die Groß- und Kleinschreibung, wie in unserer Netiquette unter dem Punkt 15 erwünscht - vielen Dank.

mfg Maik
 
Status
Nicht offen für weitere Antworten.
Zurück