Autor |
Nachricht |
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Mo 07.06.2010 11:49
Titel Drop Down verschwindet (Wordpress) |
|
|
Im Wordpress habe ich eine Seite mit Drop Down Menü erstellt. Eigentlich funktioniert alles - bis auf das wichtigste. Während man auf den Hauptpunkt fährt, öffnen sich zwar die Unterseiten im Drop Down, wenn ich aber "herunterfahre" um einen dieser Punkte auszuwählen, verschwinden sie auch schon wieder. Die Webseite findet ihr unter http://tennis-roger.ch
Der Code:
Code: |
<div id="nav">
<ul>
<li <?php if(is_home()){echo 'class="current_page_item"';}?>><a href="<?php bloginfo('siteurl'); ?>/" title="Startseite">Startseite</a>
</li>
<?php wp_list_pages('title_li=&depth=2&sort_column=menu_order'); ?>
</ul>
</div>
|
Und im CSS:
Code: |
/*Main Navbar */
#nav {
float:left;
padding-left:30px;
padding-top:15px;
}
#nav ul {
margin:0;
display:block;
list-style:none;
}
#nav ul li a {
color:#024d7c;
font-size:1.3em;
float:left;
height:23px;
padding:0 22px 0 22px;
margin: 0 2px 0 2px;
display:block;
text-decoration:none;
}
#nav li {
height:23px;
float: left;
list-style: none;}
#nav ul li.current_page_item a, #nav ul li.current_page_ancestor a {
color:#024d7c;
float:left;
height:23px;
padding:0 22px 0 22px;
margin:0 2px 0 2px;
display:block;
text-decoration:none;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
}
#nav li:hover {
color:#024d7c;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
text-decoration:none;
}
#nav a, #nav a:visited {
display: block;
color: #024d7c;
text-decoration:none;
}
/* Dropdown Menus */
#nav li ul {
margin-top:30px;
margin-left:15px;
position: absolute;
left: -999em;
padding: 0px;
height: auto;
width: 174px;
list-style:disc;
font-size:0.8em;
}
#nav li li {
width: 172px;
height:15px;
}
#nav li li a, #nav li li a:visited {
background-image:none;
display:block;
text-decoration:none;
color:#3ec7f4;
margin:0;
padding:0;
}
#nav li li a:hover, #nav li li a:active {
background:#fff;
background-image:none;
text-decoration:none;
color:#024d7c;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left: auto;
}
a.main:hover {
background:none;
}
|
Danke!
|
|
|
|
|
top
Moderator
Dabei seit: 25.11.2003
Ort: Hedwig Holzbein
Alter: 52
Geschlecht:
|
Verfasst Mo 07.06.2010 12:23
Titel
|
|
|
Versuch mal das:
Code: | #nav li {
height:40px;
float: left;
list-style: none;} |
Da dir die Darstellung im IE6 scheinbar egal ist, brauche ich wohl auch nicht noch darauf hinweisen, dass das Menü dort gar nicht aufklappt...
|
|
|
|
|
Anzeige
|
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Mo 07.06.2010 12:59
Titel
|
|
|
Code: | #nav li ul {
margin-top:30px;
margin-left:15px;
position: absolute;
left: -999em;
padding: 0px;
height: auto;
width: 174px;
list-style:disc;
font-size:0.8em;
} |
ersetzen durch:
Code: | #nav li ul {
position: relative;
top:30px;
left:0;
padding: 0;
height: auto;
width: 174px;
list-style:disc;
font-size:0.8em;
} |
Code: | #nav li {
height:23px;
float: left;
list-style: none;} |
ersetzen durch:
Code: | #nav > li {
height:23px;
float: left;
position: relative;
list-style: none;} |
sollte dich schon mal weiter bringen
Zuletzt bearbeitet von sahnemuh am Mo 07.06.2010 13:00, insgesamt 1-mal bearbeitet
|
|
|
|
|
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Mo 07.06.2010 15:17
Titel
|
|
|
Danke euch beiden schon mal für die Hilfe!
@top: Zitat: | Da dir die Darstellung im IE6 scheinbar egal ist, brauche ich wohl auch nicht noch darauf hinweisen, dass das Menü dort gar nicht aufklappt... |
Aus welchem Grund funktioniert es im IE6 nicht, bzw. was müsste ich ändern?
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 07.06.2010 15:34
Titel
|
|
|
irenehofer hat geschrieben: | Danke euch beiden schon mal für die Hilfe!
@top: Zitat: | Da dir die Darstellung im IE6 scheinbar egal ist, brauche ich wohl auch nicht noch darauf hinweisen, dass das Menü dort gar nicht aufklappt... |
Aus welchem Grund funktioniert es im IE6 nicht, bzw. was müsste ich ändern? |
Der IE6 kennt kein li:hover. Dazu müsstest Du mit JS ran.
Beispielsweise mit: Whatever:hover
Grüße
zweitaccount
|
|
|
|
|
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Mo 07.06.2010 15:37
Titel
|
|
|
Danke dir, zweitaccount! Weisst du zufälliger auch, wie ich den Hintergrund in den Drop Downs raus bekomm? Hab es mit background-image:none versucht, aber komme nicht dahinter...
|
|
|
|
|
top
Moderator
Dabei seit: 25.11.2003
Ort: Hedwig Holzbein
Alter: 52
Geschlecht:
|
Verfasst Mo 07.06.2010 15:51
Titel
|
|
|
Dann würde ich dir mal empfehlen, deine Seite mal hier rein zu schmeißen: http://browsershots.org/
Das sind dann zwar nur statische Bilder, und den Rollover wirst du dort nicht austesten können, aber du wirst sehen, dass der IE6 auch keine transparenten PNGs mag. Entweder auf Alpha-Transparenzen verzichten oder mal nach "pngfix" suchen.
Um das Rollover bei der Navigation auch für den IE6 vernünftig hin zu bekommen, wäre es sinnvoll, wenn du es direkt in dem ollen Browser austesten würdest.
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 07.06.2010 16:21
Titel
|
|
|
Wg. den Hintergrundbildern:
Das scheint mglw. 'nur' ein Vererbungsproblem zu sein.
Da müsstes du wohl noch zusätzlich beim #nav li li den
li:hover rückgängig machen.
Also schätzungsweise so:
Code: | #nav li li, #nav li li:hover {
height:15px;
width:172px;
background-image:none;
}
|
|
|
|
|
|
|
|
|
Ähnliche Themen |
wordpress drop down menü einbauen
[css] schrift verschwindet
Seiteinhalt verschwindet im IE
Inneres Fenster verschwindet
DropDown Menü verschwindet
Photoshop: Auswahlkante verschwindet
|
|