nicht angemeldet
Abstand von li innerhalb einer ungeordneten Liste mit BG Image
Gunnar BittersmannWie kann man den Abstand von li zum Rand (obere Kante) von ul verändern wenn es sich um eine horizontale Linie handelt?
ul hat ein Hintergrundbild und die Elemente in li sollen "etwas weiter runter" damit der Text nicht im Bild hängt.
Leider geht es weder wenn ich für li padding/margin vergebe (wirkt sich nur horizontal, also links und rechts aus), noch wenn ich den Links innerhalb von li padding zuweise.
Hat jemand da einen Tipp ?
Hier der Code:
#kopf h3 {
width:1024px;
height:125px;
margin:0;
background:url(../images/kopf.jpg) no-repeat scroll 0px 0px;
}
#kopf h3 span {
display:none;
}
#kopf ul {
width: 1024px;
height:50px;
margin:0;
padding:0;
background:url(../images/liste.jpg) no-repeat scroll 0px 0px;
list-style-type:none;
text-align:center;
}
#kopf li {
display:inline;
margin:0px;
padding:0px 5px;
}
#kopf ul li a {
font-family:Verdana, Geneva, sans-serif;
font-size:11pt;
font-weight:bold;
color:#8b222d;
text-decoration:none;
padding-top:5px;
}
...
<link rel="stylesheet" href="/css/style.css" type="text/css" />
</head>
<body>
<div id="kopf">
<h3><span>Text</span></h3>
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
</div>
</body>
</html>
-
hi,
Wie kann man den Abstand von li zum Rand (obere Kante) von ul verändern wenn es sich um eine horizontale Linie handelt?
Schon mit padding für
<ul>probiert?mfg
-
arg, total übersehen. ok danke schön.
hi,
Wie kann man den Abstand von li zum Rand (obere Kante) von ul verändern wenn es sich um eine horizontale Linie handelt?
Schon mit padding für
<ul>probiert?mfg
-
-
@@listentyp:
nuqneH
Leider geht es weder wenn ich für li padding/margin vergebe (wirkt sich nur horizontal, also links und rechts aus)
Das ist bei Inline-Elementen nicht anders zu erwarten.
noch wenn ich den Links innerhalb von li padding zuweise.
S.o. '#kopf li a' auf "block" setzen? Aber halt, beim Menüpinkt der aktuellen Seite sollte gar kein 'a'-Element vorhanden sein: „Verlinke niemals auf die aktuelle Seite.“ (Punkt 10 der zehn meist-missachteten Homepage-Design-Richtlinien [Nielsen])
Hat jemand da einen Tipp ?
'li' nicht auf "inline" setzen, sondern auf "inline-block" (oder floaten).
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)