Hallo,
ich habe ein CSS - Menu mit li und ul erstellt.
Wozu ich scheinbar nicht in der Lage bin, ist einen bestimmten Abstand zwischen den Menupunkten hinzukriegen.
Wie definiert man den Zeilenabstand in einer Liste?
Krieg ich einfach nicht hin.
Lasst Milde walten, schimpft und lacht nicht - aber helft miiiir.
Danke,
Andrea
Beispielsweise so:
ul { padding: 10px; }
Siehe auch http://de.selfhtml.org/css/eigenschaften/innenabstand.htm#padding
Hallo ttb,
danke für die Antwort.
Habe ich schon gesetzt. Das ergibt bei mir aber nur den Abstand des Untermenus zum darüberleigenden Element.
Also:
Test1
Test 1.2
Test2
Test3
Test4
Ich möchte aber den Abstand zwischen den Hauptmenupunkten ändern.
Weisst du Rat?
Gruß
Andrea
Hallole!
Wenn Du es mit TS "vorbereitet" hast, hast du doch möglicherweise für jede Ebene eine eigene id= oder class= vergeben. Z. B.
.
.
.
menulinks.1 {
### Normal
NO.stdWrap.htmlSpecialChars = 1
NO.allWrap = <li id="normal_l1"> | </li>
.
.
.
menulinks.2 {
### Normal
NO.stdWrap.htmlSpecialChars = 1
NO.allWrap = <li id="normal_l2"> | </li>
Dann kannst Du doch auch die id der jeweiligen Stufe gezielt ansprechen und die padding Angabe abhängig von der Stufe vergeben.
Wenn Du möchtest, könnte ich Dir ein Beispiel (TS, html, css) schicken.
Gruß
Erwin
Hallo ehontheim,
für ein Beispiel wäre ich dir extrem dankbar.
Viele Grüße
Andrea
Dann gib mir mal Deine Email-Adresse (über pm)
Hallo zusammen,
nach der tollen Unterstützung von Erwin geht jetzt alles. Ich habe allerdings nur den Firefox und den IE getestet.
Es gibt zwei Menus:
Eine horizontale "Kurznavi", deren Punkte nicht in der seitlichen Navigation auftauchen sollen und eine
seitliche Navigation mit einer Unterebene. Rollover- und Active Effekt (Schriftfarbe und Bildchen mit Punkt (Punkt bei Active andere Farbe)
Für alle, die es brauchen können:
Erstellt habe ich ein Menu mit unsortierter Liste.
Hier die Setup Einträge für das Menu:
marks.MENU = HMENU
#excludeUIDList soll Seiten aus dem Menu entfernen
#Evtl. problematisch, weil das Menu2 vielleicht nicht barrierefrei ist ?.
marks.MENU.excludeUidList = 624, 625, 626, 627, 774, 775
marks.MENU.entryLevel = 0
marks.MENU {
1 = TMENU
1 {
wrap = <ul> | </ul>
entryLevel = 0
noBlur = 1
NO {
allWrap = <li id="menu_main"> | </li>
WrapItemAndSub = <li> | </li>
after = <br />
ATagParams = class = "menu_main"
beforeImg = fileadmin/xxx/images/pix-punkt-t.gif
beforeROImg = fileadmin/xxx/images/pix-t.gif
RO = 1
}
ACT < .NO
ACT.ATagParams = class = "menu_mainact"
ACT = 1
ACT.beforeImg = fileadmin/xxx/images/pix-t-act.gif
}
2 = TMENU
2 {
wrap = <ul class="menu_sub"> | </ul>
#entryLevel = 1
noBlur = 1
NO {
ATagParams = class = "menu_sub"
beforeImg = fileadmin/xxx/images/pix-punkt-t.gif
beforeROImg = fileadmin/xxx/images/pix-t.gif
RO = 1
}
ACT < .NO
ACT.ATagParams = class="menu_subact"
ACT = 1
ACT.beforeImg = fileadmin/xxx/images/pix-t-act.gif
}
}
marks.MENU2 = HMENU
marks.MENU2.entryLevel = 0
marks.MENU2.special = list
marks.MENU2.special.value = 623, 624, 625, 627, 774, 775, 90
marks.MENU2 {
1 = TMENU
1 {
wrap = <ul> | </ul>
NO {
WrapItemAndSub = <li> | </li>
after = |
ATagParams = class="menu_2"
StdWrap.case = lower
}
ACT < .NO
ACT.ATagParams = class="menuact"
ACT = 1
}
}
}
Hier der Ausschnitt aus dem CSS.
/* Positionierung des Menus, seitliche Navigation*/
.menu {
display: block;
background-color: #FFFFFF;
position: absolute;
top: 180px;
left: 35px;
width:auto;
}
/*Klasse für die seitliche Navigation, 1. Ebene*/
.menu_main{
color: #555656;
text-decoration:none;
font-size: 12px;
font-family: Arial, Verdana, Tahoma;
font-color: #00B9F3;
}
/*Klasse für die seitliche Navigation, 1. Ebene, Aktiv*/
.menu_mainact {
color: #555656;
text-decoration:none;
font-size: 12px;
font-family: Arial, Verdana, Tahoma;
font-color: #00B9F3;
}
/*Klasse für die seitliche Navigation, 1. Unter-Ebene*/
.menu_sub {
color: #555656;
text-decoration:none;
font-size: 12px;
font-family: Arial, Verdana, Tahoma;
font-color: #00B9F3;
}
/*Klasse für die seitliche Navigation, 1. Unter-Ebene, Aktiv*/
.menu_subact {
list-style-position: outside;*/
color: #555656;
text-decoration:none;
font-size: 12px;
font-family: Arial, Verdana, Tahoma;
font-color: #00B9F3;
}
/*<!-- Menu2 / spezielle Linkfarbe für die oberere horizontale Navi-->*/
.menu2 a:hover {
color: #FFFFFF;
}
.menu2act a:active {
color: #00B9F3;
}
/*<!-- Hauptbereich -->*/
/*Positionierung Oberes Menü, Links ohne Untermenu*/
.menu2 {
float:left;
position: relative;
top: 95px;
padding:0px;
padding-left: 50px;
width:auto;
}
/* 1. Abstand oben 2. Abstand rechts 3. Abstand unten 4. Wert sorgt für die Einrückung - IE und FFOX (Abstand links)*/
ul {
margin: 0px;
padding: 5px 5px 5px 10px;
}
li {
margin: 0px;
padding: 5px 5px 5px 0px;
list-style-type: none;
}
#MENU li; #rootline li {
margin: 0px;
padding: 10px;
}
MENU a:link, #MENU a:visited {
text-decoration: underline;
color: #FFFFFF;
}
Bis dann,
Andrea