Autor |
Nachricht |
Nimroy
Community Manager Threadersteller
Dabei seit: 26.05.2004
Ort: zwischen Köln und D'dorf
Alter: 46
Geschlecht:
|
Verfasst Do 01.03.2007 20:23
Titel DropDown-Menü funktioniert im FF, aber nicht im IE |
|
|
Und ich hab keine Ahnung wieso. Zu sehen hier: http://autohaus.jungundmittellos.de
Und wenn mir dann noch jemand verrät, warum das Content-Bild bei ie nach oben rutscht...
MErci!
|
|
|
|
|
rob
Dabei seit: 11.12.2003
Ort: ~/
Alter: 46
Geschlecht:
|
Verfasst Do 01.03.2007 20:44
Titel
|
|
|
ich hab jetzt leider keinen IE hier um mir das problem anzuschauen.
mit fällt aber direkt mal auf, daß die dtd-angabe fehlerhaft ist.
so sieht sie aus:
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd" > |
und so sollte sie aussehen:
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
bei der fehlerhaften angabe schaltet der IE sicherlich in den quirks-mode.
weiß nicht, ob es vielleicht daran liegen könnte...
werde mir das heute später mal im IE anschauen.
|
|
|
|
|
Anzeige
|
|
|
Nimroy
Community Manager Threadersteller
Dabei seit: 26.05.2004
Ort: zwischen Köln und D'dorf
Alter: 46
Geschlecht:
|
Verfasst Do 01.03.2007 20:53
Titel
|
|
|
Habs korrigiert und hochgeladen. Sieht unverändert aus.
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 01.03.2007 20:55
Titel
|
|
|
IE6? Unterstützt :hover nur für Hyperlink Elemente und nicht wie
bei dir notwendig für Listen Punkte. Um das zum laufen zu bringen musst
du auf eine kleines JavaScript zurückgreifen. Google: Suckerfish Dropdown
Zuletzt bearbeitet von m am Do 01.03.2007 20:55, insgesamt 1-mal bearbeitet
|
|
|
|
|
pRiMUS
Dabei seit: 09.09.2003
Ort: Vienna
Alter: 48
Geschlecht:
|
Verfasst Do 01.03.2007 20:57
Titel
|
|
|
nochwas, im ie7 stimmen die positionen deiner dropdowns nicht.
|
|
|
|
|
Nimroy
Community Manager Threadersteller
Dabei seit: 26.05.2004
Ort: zwischen Köln und D'dorf
Alter: 46
Geschlecht:
|
Verfasst Mo 19.03.2007 15:25
Titel
|
|
|
So, hab jetzt mal das berühmte suckerfish dropdown integriert. Leider zeigt er das Menü nicht mehr in einer reihe, sondern untereinander an. Kann mir wer verraten, wie ich das wieder hinkriege?
...Muss noch viel lernen mit css...
Hier mal das HTML:
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Leichlinger Autohaus</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="styles2.css" rel="stylesheet" type="text/css">
<script type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
//--><!]]></script>
</head>
<body>
<div id="main">
<div id="linie_oben"> </div>
<div id="header">
<div id="box_links"> </div>
<div id="header_img"><img src="back1.jpg"></div>
<div id="logo"> </div>
</div>
<div id="menu">
<ul id="nav">
<li><h2><a href="index.php">Home</a></h2></li>
<li><h2>Handel</h2>
<ul>
<li><a href="neuwagen.php">Neuwagen</a></li>
<li><a href="jahreswagen.php">Jahres- und Gebrauchtwagen</a></li>
<li><a href="importwagen.php">EU-Importe</a></li>
<li><a href="autoscout.php">Autoscout24</a></li>
</ul>
</li>
<li><h2>Service</h2>
<ul>
<li><a href="reparatur.php">Reparatur</a></li>
<li><a href="inspektion.php">Inspektion & Wartung</a></li>
<li><a href="mietwagen.php">Mietwagen</a></li>
</ul>
</li>
<li><h2><a href="unternehmen.php">Unternehmen</a></h2></li>
<li><h2>Kontakt</h2>
<ul>
<li><a href="mailform.php">Mailformular</a></li>
<li><a href="anfahrt.php">Anfahrt</a></li>
</ul>
</li>
</ul>
</div>
<div id="content">
<img src="home.gif">
</div>
<div id="footer">
<p><a href="impressum.html">Impressum</a></p>
</div>
</div>
</body>
</html> |
Und hier das CSS:
Code: |
body {
background: url(background.png) repeat-x;
margin: 0px;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 12px;
}
h2 {
margin: 0;
}
#main{
background-color: white;
margin-left: auto;
margin-right: auto;
padding: 10px 16px 0px 16px;
position: relative;
width: 740px;
}
#linie_oben{
width: 740px;
height: 20px;
background-color: #8384aa;
margin: 0 0 5px 0;
}
#header {
height: 205px;
position: relative;
}
#header_img {
position: absolute;
right: 0;
top: 0;
}
#box_links {
background: #080A55;
height: 200px;
left: 0;
position: absolute;
top: 0;
width: 260px;
}
#logo{
position: absolute;
top: 62px;
right: 0px;
width: 170px;
height: 76px;
background: #080a55 url(logo.gif);
z-index: 1;
}
#menu {
background-color: #8384aa ;
float: left;
height: 20px;
width: 740px;
z-index: 1;
}
#menu ul, #menu ul a {
list-style: none;
margin: 0px;
padding: 0px;
text-decoration: none;
width: 127px;
}
#menu ul h2{
border-right: 5px solid white;
}
#menu a, #menu h2 {
font: bold 12px/14px verdana, arial, helvetica, sans-serif;
display: block;
margin-top: 0px;
margin-right: 0px;
padding-top: 0px;
padding-left: 20px;
height: 20px;
vertical-align: middle;
}
#menu h2, #menu h2 a {
color: #FFFFFF;
line-height: 20px;
}
#menu ul li ul a {
border-bottom: 1px solid white;
border-right: none;
color: #080a55;
background: #cecedd;
text-decoration: none;
font-weight: normal;
font-size: 10px;
line-height: 12pt;
height: auto;
padding-left: 4px;
padding-right: 4px;
padding-top: 0px;
width: 119px;
}
#menu ul li ul a:hover {
background: #fff;
color: #a00;
}
#menu li {
float: left;
position: relative;
width: 10em;
}
/*
#menu ul ul {
margin: 0px 0px 0px 0px;
border-right: none;
padding-top: 0px;
z-index: 500;
}
div#menu ul li ul{
display: none;
} */
div#menu ul li:hover ul{
display: block;
}
#menu li ul { /* second-level lists */
display: none;
position: absolute;
top: 1em;
left: 0;
}
#menu li:hover ul, #menu li.over ul { /* lists nested under hovered list items */
display: block;
}
#content{
background-color: white;
width: 740px;
clear: left;
}
#footer p {
margin: 0;
padding-left: 10px;
}
#footer {
background-color: #8384aa;
height: 20px;
margin: 10px 0px 20px 0px;
width: 740px;
}
#footer a, #footer a:visited {
color: white;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 11px;
line-height: 20px;
text-decoration: none;
vertical-align: middle;
}
#footer a:hover {
font-weight: bold;
text-decoration: underline;
}
a:visited {
color:#4E4B4A; text-decoration: underline;
}
a:link {
color:#4E4B4A; text-decoration: underline;
}
a:hover {
color: #4E4B4A;
font-weight: ;
line-height: 165%;
text-decoration: underline;
}
li > ul {
top: auto;
left: auto;
}
|
Ich bedanke mich schon mal jetzt überschwenglich für die Mühe!
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mo 19.03.2007 15:45
Titel
|
|
|
Entferne mal bei "#menu ul" die width Angabe.
|
|
|
|
|
Nimroy
Community Manager Threadersteller
Dabei seit: 26.05.2004
Ort: zwischen Köln und D'dorf
Alter: 46
Geschlecht:
|
Verfasst Mo 19.03.2007 17:55
Titel
|
|
|
m hat geschrieben: | Entferne mal bei "#menu ul" die width Angabe. |
Darf ich fragen, warum das jetzt geht? Ich würde natürlich schon gerne eine Breite haben, die der der Submenüs entspricht. Außerdem sind die Submenüs jetzt ein paar Pixel zu hoch.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Dropdown Menü
DropDown Menü verschwindet
CSS Javascript Dropdown menü
JavaScript-Dropdown-Menü
IE Fehler bei DropDown Menü
[FLASH] DropDown Menü
|
|