Menu Formatierung funktioniert nur teilweise
Hi,
ich habe ein aufklapp Menü bestehend aus verschachtelten Listen
HTML-Code:
<html>
<head>
<title>Testseite</title>
<style type="text/css">
#flexi-pages-1 {
margin-top: -10px !important;
margin-top: 0px;
}
#menu ul {
padding-left: 0px;
}
#menu ul li {
list-style-type:none;
line-height: 20px;
}
#menu ul ul li, #menu ul ol li {
margin: 0px 0 0;
padding: 0;
}
#menu a {
display: block;
line-height: 20px;
padding-left: 35px;
width: 153px;
font-size:11px;
font-weight:500;
color:#666666;
background:#ddd4c6 url('http://localhost/img/menu_arrow.gif') no-repeat left center;
border-bottom: 1px solid white;
text-decoration: none;
}
.parent li ul li a {
display: block;
line-height: 20px;
width: 188px;
color: black;
background-color: #000;
}
.parent li {
margin-left: -10px;
width: 188px;
list-style-type: none;
list-style-image: none;
}
.parent {
text-decoration: none;
width: 148px;
padding-left: 0px;
}
.parent ul {
width: 188px;
margin-left: 0px !important;
margin-left: 0px;
}
.topmenu a:hover
{
color:#ffffff;
text-decoration:none;
}
</style>
</head>
<body>
<div id="menu" style="width: 10px;">
<ul>
<li id="flexi-pages-1" class="widget flexipages_widget"><ul class="parent">
<li class="page_item page-item-78"><a href="http://localhost/wordpress/modellubersicht" title="Modellübersicht">Modellübersicht</a></li>
<li class="page_item page-item-2"><a href="http://localhost/wordpress/about" title="Gebrauchtwagen">Gebrauchtwagen</a></li>
<li class="page_item page-item-22 current_page_ancestor current_page_parent"><a href="http://localhost/wordpress/kundenservice" title="Kundenservice">Kundenservice</a>
<ul>
<li class="page_item page-item-24"><a href="http://localhost/wordpress/kundenservice/werkstatt" title="Werkstatt">Werkstatt</a></li>
<li class="page_item page-item-26 current_page_item"><a href="http://localhost/wordpress/kundenservice/finanzierung" title="Finanzierung">Finanzierung</a></li>
<li class="page_item page-item-28"><a href="http://localhost/wordpress/kundenservice/versicherung" title="Versicherung">Versicherung</a></li>
<li class="page_item page-item-30"><a href="http://localhost/wordpress/kundenservice/newsletter-2" title="Newsletter">Newsletter</a></li>
</ul>
</li>
<li class="page_item page-item-36"><a href="http://localhost/wordpress/unternehmensinfos" title="Unternehmensinfos">Unternehmensinfos</a></li>
<li class="page_item page-item-42"><a href="http://localhost/wordpress/kontaktformular" title="Kontakt">Kontakt</a></li>
<li class="page_item page-item-50"><a href="http://localhost/wordpress/downloads" title="Downloads">Downloads</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
Nun habe ich das Problem, das ich diesen Teil des Menüs
HTML-Code:
<li class="page_item page-item-22 current_page_ancestor current_page_parent"><a href="http://localhost/wordpress/kundenservice" title="Kundenservice">Kundenservice</a>
<ul>
<li class="page_item page-item-24"><a href="http://localhost/wordpress/kundenservice/werkstatt" title="Werkstatt">Werkstatt</a></li>
<li class="page_item page-item-26 current_page_item"><a href="http://localhost/wordpress/kundenservice/finanzierung" title="Finanzierung">Finanzierung</a></li>
<li class="page_item page-item-28"><a href="http://localhost/wordpress/kundenservice/versicherung" title="Versicherung">Versicherung</a></li>
<li class="page_item page-item-30"><a href="http://localhost/wordpress/kundenservice/newsletter-2" title="Newsletter">Newsletter</a></li>
</ul>
</li>
nur teilweise Stylen kann, so funktionieren zum Beispiel width und display: block ohne probleme aber zum Beispiel den Hintergrund bekomme ich nicht geändert.
Hier nochmal der Teil des CSS das mir die Unterliste anpassen soll
HTML-Code:
.parent li ul li a {
display: block;
line-height: 20px;
width: 188px;
color: black;
background-color: #000;
}
Wäre super wenn jemand einen Tipp hätte wo mein Problem liegt.
Grüße
Chris
|