So gut Drupal auch ist, eine oft gestellte Frage ist, wie man bei Menüs die Listenpunkte wegkriegt. Man probiert oft rum, schaut sich das CSS-Gerüst an – und kommt nicht weiter.

Ein einfaches und schlichtes CSS-Menü, kann dann oft zum Problem führen.

Hier ein kleines CSS-Snippet, das das Listenproblem bei Drupal löst.

.block ul, ul.menu, .item-list ul {
margin:0;
font:1em arial;
font-weight:bold;
}

.block ul li {
list-style:none;
}

.block ul li a {
text-decoration:none;
border-bottom:1px dotted #BBBBBB;
font-size:1.1em;
line-height:1.6;
padding:0.4em 8px 0.5em;
display:block;
color:#666;
}

.block ul ul{
padding-top:10px;
}

.block ul li ul li {
padding:0;
margin:0;
}

.block ul li ul li a {
text-decoration:none;
border-bottom:0px dotted #BBBBBB;
font-size:1em;
line-height:1.6;
padding:0.4em 8px 0.5em;
display:block;
color:#245FA1;
font-weight:normal;
}

.leaf .active {
display:block;
color:#000;
}

.expanded .active {
display:block;
color:#000;
}

(Sieht dann folgendermaßen aus)