nicht angemeldet
Li keinen Abstand inzwischen
Hallo,
ich möchte eine Liste mit ul generieren:
<ul>
<li style='border:1px solid red;font-size:8pt'>EINS</li>
<li style='font-size:8pt'>ZWEI</li>
</ul>
Im Firefox sieht das auch gut aus nur der IE macht mir einen Abstand inzwischen.
wenn ich nun bei den li's ein height:8pt einfüge klappt es im IE dann aber stimmt das Layout im Firefox und Opera nicht mehr.
Padding und Margin bringt nichts habe ich schon probiert.
Jemand eine Idee?
Gruß
Andi
-
Hallo Andi.
<ul>
<li style='[code lang=css]border:1px solid red;font-size:8pt
Entwirfst du ein Drucklayout? Wenn nicht, dann solltest du nicht pt sondern em oder % als Maßeinheit für die Schriftgröße verwenden. Das Inline-Stylesheet diente hier nur zur einfacheren Darstellung, oder? > wenn ich nun bei den li's ein height:8pt einfüge klappt es im IE dann aber stimmt das Layout im Firefox und Opera nicht mehr. Wie gesagt ist diese Maßeinheit nicht geeignet. > Padding und Margin bringt nichts habe ich schon probiert. Sowohl für das ul- als auch das für li-Element? Einen schönen Donnerstag noch. Gruß, Ashura -- sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:| [<mathbr:del.icio.us/>](http://del.icio.us/mathbr) [<mathbr:w00t/>](http://w00t.noctus.net)-
Hallo Ashura,
<ul>
<li style='[code lang=css]border:1px solid red;font-size:8pt
> > Entwirfst du ein Drucklayout? Wenn nicht, dann solltest du nicht pt sondern em oder % als Maßeinheit für die Schriftgröße verwenden. Ist nur auf die Schnelle > > Das Inline-Stylesheet diente hier nur zur einfacheren Darstellung, oder? Genau > > > Padding und Margin bringt nichts habe ich schon probiert. > > Sowohl für das ul- als auch das für li-Element? Ja für beides. Ich glaube das ist der white-space-Bug im IE. Nur wie umgehe ich den? Ich habe mal einen Ansatz: li {display:inline;} li span {display: block;} <ul> <li><span>test</span></li> <li><span>test</span></li> </ul> Dann bricht aber der Firfox nicht mehr um. Gruß Andi-
Hallo Andi.
Padding und Margin bringt nichts habe ich schon probiert.
Sowohl für das ul- als auch das für li-Element?
Ja für beides. Ich glaube das ist der white-space-Bug im IE.
Kann ich alles nicht nachvollziehen.
Sieh dir einmal mein Beispiel an. Gäbe es noch eine Abstand zwischen den li-Elementen, so würde das ul-Element rot hindurchscheinen.
Einen schönen Donnerstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
mathbr:del.icio.us/ mathbr:w00t/-
Hallo Ashura,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ul and li: padding and margin</title>
<style type="text/css">
ul, li {
margin:0;
padding:0;
}
ul {color:#fff;
}
li {
padding-left:20px;
background:#036;
border: 1px solid red;font-size:0.7em;
}li {
background-repeat: no-repeat;
background-image: url(http://devhu.destour.info/images/RightArrow.gif);
background-position: left center;
}
</style>
</head>
<body>
<ul>
<li><span>Foo</span></li>
<li>Bar</li>
<li>Baz</li>
<li>Qux</li>
</ul>
</body>
</html>Man sieht, dass hier der Pfeil nicht geanu in der Mitte ist
Beim nächsten Beispiel ist er dann in der Mitte:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ul and li: padding and margin</title>
<style type="text/css">
ul, li {
margin:0;
padding:0;
}
ul {color:#fff;
}
li {
padding-left:20px;
background:#036;
border: 1px solid red;
_display:inline;
font-size:0.7em;
}li span {display:block;}
li {
background-repeat: no-repeat;
background-image: url(http://devhu.destour.info/images/RightArrow.gif);
background-position: left center;
}
</style>
</head>
<body>
<ul>
<li><span>Foo</span></li>
</ul>
</body>
</html>Firefox zeigt alles richtig an schon beim 1. mal
Gruß
Andi
-
-
-
Hallo Ashura,
also ich habe jetzt folgende Lösung:
<ul>
<li style='font-size:0.91em;_display:inline;'><span style='_display:block;'>test</li>
</ul>Das ist zwar nicht 1. Sahne aber es funktioniert. Ich glaube da setzt der IE line-height falsch
Gruß
Andi
-