Immernoch Listen
Martin Hein
- css
0 Rafael0 Cheatah
Hallo Forum,
ich versuche immernoch ein CSS-Menu hinzubekommen.
Es will mir nicht gelingen. Im Moment versuche ich
mal wieder ein Beispiel anzupassen. Und siehe da,
ich bekomme es wohl auch dahin gebogen, wo ich es
brauche. Trotzdem verstehe ich die Logik nicht ;)
1. Die Ausgabe:
---------------
http://dcbkk.usewebworx.no-ip.com/test14.php
(usr:forum; passwd: test)
2. Der Code:
------------
steht etwas weiter unten.
3. Meine konkrete Frage:
------------------------
wer oder was sorgt dafür, dass das Untermenu eingerückt ist ?
Ich kann das zwar beeinflussen:
-------------------
#list .subliste li{
...
margin:0 0 0 0;
...
}
-------------------
... indem ich einen negativen wert für die margin vergebe,
aber wie errechnet sich das ?
Das grosse Fragezeichen CSS ???
besten dank und
viele gruesse,
martin
Versuche es mit padding-left: 0; für das Element li.
Hi,
wer oder was sorgt dafür, dass das Untermenu eingerückt ist ?
padding, margin oder (theoretisch) border des Menüs, des Listenpunktes, des Untermenüs und/oder der Listenpunkte des Untermenüs.
Cheatah
Hi,
Erstam Danke für die Antworten!
ich hatte den Code garnicht vollständig in das posting gepostet.
Der steht nun vollständig weiter unten.
Das Untermenu ist eigerückt, obwohl alle margins und alle paddings
explizit auf 0 gesetzt wurden. das einzige, was einen abstand in
irgendeiner form erzeugen kann, ist eine border-bottom. was anderes
fällt mir nicht ein.
danke fürs lesen und
beste gruesse,
martin
CODE:
-----
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>DC BKK - Startseite</title>
<style type="text/css">
<!--
#mainmenu{
margin:0;
padding:0;
width:155px;
border-top:1px solid #a7a7a7;
}
#mainmenu li{
list-style:none;
padding:0px; /*Abstand des Textes im Hauptmenu zum Rand des mainmenuenpunktes*/
margin:0px 0px 0px 0px; /*Abstand der Hauptmenu-mainmenuenpunkte zu anderen Elementen*/
background:#ffffff;
border-bottom:1px solid #a7a7a7;
color:#7B8288;
}
#mainmenu li.hi{
background: url(/_global/images/mainmenu/mainmenu_bg.gif) no-repeat left top;
}
#mainmenu .submenu li{
background:#fffff;
color:#7B8288;
list-style:none;
padding:0px; /*Abstand des Textes im Untermenu zum Rand des Untermainmenuenpunktes*/
margin:0 0 0 0; /*Abstand der Untermenu_mainmenuenpunkte zu anderen Elementen */
border-bottom:1px solid #a7a7a7;
width:143px;
}
#mainmenu .submenu li.hi{
background: url(/_global/images/submenu/submenu_bg.gif) no-repeat left top;
}
#mainmenu a{
font-family: arial;
font-size:12px;
line-height:12px;
font-weight: bold;
}
#mainmenu .submenu a{
font-weight: normal;
}
#mainmenu .submenu li.last{
border-bottom:0px solid #a7a7a7;
}
-->
</style>
</head>
<body>
<ul id="mainmenu">
<li class="hi"><a>lo</a></li>
<li class="hi"><a>lo</a>
<ul class="submenu">
<li class="hi"><a>lorem</a></li>
<li class="hi"><a>lorem</a></li>
<li><a>lorem</a></li>
<li class="last"><a>lorem</a></li>
</ul>
</li>
<li><a>lo</a></li>
<li><a>lo</a></li>
</ul>
</body>
</html>
Hallo
<!--
#mainmenu{
...
width:155px;
...
}#mainmenu .submenu li{
...
margin:0 0 0 0; /*Abstand der Untermenu_mainmenuenpunkte zu anderen Elementen */
ergo: margin:0;
...
width:143px;
}
Könnte es sein, dass die unterschiedliche Breite (155px vs. 143px) damit zu tun hat?
Tschö, Auge
Hi,
Das Untermenu ist eigerückt, obwohl alle margins und alle paddings
explizit auf 0 gesetzt wurden.
NÖ.
#mainmenu
#mainmenu li
#mainmenu li.hi
#mainmenu .submenu li
#mainmenu .submenu li.hi
#mainmenu a
#mainmenu .submenu a
#mainmenu .submenu li.last
Welcher dieser Selektoren selektiert das <ul class="submenu">?
Wo also werden margin/padding für <ul class="submenu"> auf 0 gesetzt?
Stimmt also die Aussage "obwohl alle margins und alle paddings explizit auf 0 gesetzt wurden"?
cu,
Andreas