Relatives width zum Elternelement im M$IE
Candid Dauth
- css
Hallo ihr da draußen,
Wenn man im M$IE eine Liste hat, in welcher sich Blockelemente befinden, so setzt er Abstände von ungefähr einer Zeile zwischen die Listeneinträge. Nun hatte mir irgenjemand erzählt, dass man dieses vermeiden könne, indem man einfach den lis width:99% zuweise. Das funktioniert soweit auch.
Jetzt habe ich nur das Problem, dass sich die Liste in einem Element befindet, für das keine Breite angegeben ist. Es soll sich quasi je nach Textlänge der Blockelemente ausdehnen. Wenn ich allerdings nun den lis 99% zuweise, macht der IE sie 99% des Browserfensters breit. Gebe ich allerdings dem Element, in dem sich die Liste befindet, eine feste Breite gebe, funktioniert es.
Gibt es nun eine Möglichkeit, dass
Ach, und da wir gerade dabei sind, hätte ich noch eine kleine HTML-Frage:
In http://de.selfhtml.org/html/tabellen/aufbau.htm#kopf_koerper_fuss steht unter "Beachten Sie", dass man immer alle drei Elemente verwenden muss, wenn man tbody usw. verwendet. Ich konnte allerdings in der HTML-4.01- bzw. der XHTML-1.0-DTD keinerlei Hinweise darauf finden. Stimmt das denn? Denn eigentlich hat ja nicht jede Tabelle eine Fußzeile...
Grüße von hier drinnen, aus Biberach an der Riss (http://www.stadt-biberach.de/),
Candid Dauth (Dogfish)
Hi,
In http://de.selfhtml.org/html/tabellen/aufbau.htm#kopf_koerper_fuss steht unter "Beachten Sie", dass man immer alle drei Elemente verwenden muss, wenn man tbody usw. verwendet. Ich konnte allerdings in der HTML-4.01- bzw. der XHTML-1.0-DTD keinerlei Hinweise darauf finden. Stimmt das denn? Denn eigentlich hat ja nicht jede Tabelle eine Fußzeile...
Fehler in SelfHTML.
Im Zweifelsfall gilt immer das, was in der DTD bzw. im Standard steht.
cu,
Andreas
Hi,
Wenn man im M$IE eine Liste hat, in welcher sich Blockelemente befinden, so setzt er Abstände von ungefähr einer Zeile zwischen die Listeneinträge.
Das sollte vom default-Margin der blocklevel-Elemente abhängen.
Nun hatte mir irgenjemand erzählt, dass man dieses vermeiden könne, indem man einfach den lis width:99% zuweise. Das funktioniert soweit auch.
auch wenn ... finde ich blödsinnig.
Setze einfach das Margin auf 0.
freundliche Grüße
Ingo
Hallo,
Wenn man im M$IE eine Liste hat, in welcher sich Blockelemente befinden, so setzt er Abstände von ungefähr einer Zeile zwischen die Listeneinträge. Nun hatte mir irgenjemand erzählt, dass man dieses vermeiden könne, indem man einfach den lis width:99% zuweise.
Schlechter Rat, das.
Die Abstände kommen mit Sicherheit von den Außenrandabständen (margins) der Blockelemente. Diese solltest Du mit CSS verringern.
Bsp.:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Block-Liste</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
<!--
li p {margin:0;}
-->
</style>
</head>
<body>
<ol>
<li><p>Punkt</p></li>
<li><p>Punkt</p></li>
<li><p>Punkt</p></li>
</ol>
</body>
</html>
viele Grüße
Axel
Hallo ihr da draußen,
li p {margin:0;}
So, ich habe das jetzt ausprobiert, allerdings werden die Abstände so immernoch angezeigt. Dazuzusagen wäre vielleicht noch, dass das Blockelement diverse padding- und border-Eigenschaften besitzt.
Im Folgenden mal der wichtige Teil des Codes:
<div id="navigation">
<ul>
<li><a href="/">Willkommen</a></li>
<li><a href="/news.php">News</a></li>
<li><a href="/guestbook.php">Gästebuch</a></li>
</ul>
</div>
Und im Stylesheet:
#navigation ul {
border:1px solid #000000;
list-style-type:none;
padding:0;
}
#navigation li {
padding:0;
margin:0;
}
#navigation a {
padding:5px 6px 5px 10px;
display:block;
white-space:nowrap;
margin:0;
}
#navigation a:focus,#navigation a:active,#navigation a:hover {
border-top:1px solid #000000;
border-bottom:1px solid #000000;
padding:4px 5px;
border-left:5px solid #000000;
border-right:1px solid #000000;
margin-left:0;
margin-right:0;
}
Hat noch jemand eine Idee, was ich machten könnte, um die Abstände wegzubekommen?
Grüße von hier drinnen, aus Biberach an der Riss (http://www.stadt-biberach.de/),
Candid Dauth (Dogfish)
Hallo,
Im Folgenden mal der wichtige Teil des Codes:
<div id="navigation">
<ul>
<li><a href="/">Willkommen</a></li>
<li><a href="/news.php">News</a></li>
<li><a href="/guestbook.php">Gästebuch</a></li>
</ul>
</div>Und im Stylesheet:
#navigation a {
padding:5px 6px 5px 10px;
display:block;
white-space:nowrap;
margin:0;
}
Ein Element, welches normalerweise ein Inline-Element ist, und mit display Block formatiert wird, verhält sich etwas anders als ein HTML-Block-Element. Unter anderem hat es normalerweise _keine_ Standard-Margins. Du kannst das margin:0 also wieder wegnehmen.
Hier macht der IE nun wirklich etwas komisches bei der Berechnung der Breite der Block-A-Elemente. Eine Lösung wäre, für das DIV-Element ein fixe Breite festzulegen und für die A-Elemente dann width:100%. Das willst Du aber nicht. Der Fehler bei der Breitenberechnung liegt anscheinend noch im Box-Model-Bug und der Rahmenberechnung begründet. Wenn man nämlich den LI-Elementen Rahmen gibt, stimmt es plötzlich wieder. Solltest Du also mit einem Rahmen in Hintergrundfarbe für die LI-Elemente leben können, wäre das ein Workaround.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Liste Block-A-Elemente</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
<!--
#navigation ul {
border:1px solid #000000;
list-style-type:none;
padding:0;
margin:0;
}
#navigation li {
border:1px solid white;
padding:0;
margin:0;
}
#navigation a {
padding:5px 6px 5px 10px;
display:block;
white-space:nowrap;
}
#navigation a:focus,#navigation a:active,#navigation a:hover {
border-top:1px solid #000000;
border-bottom:1px solid #000000;
border-left:5px solid #000000;
border-right:1px solid #000000;
padding:4px 5px;
}
-->
</style>
</head>
<body>
<div id="navigation">
<ul>
<li><a href="/">Willkommen</a></li>
<li><a href="/news.php">News</a></li>
<li><a href="/guestbook.php">Gästebuch</a></li>
</ul>
</div>
</body>
</html>
Dieses Beispiel sieht bei mir im IE6, NN7 und Opera7.21 gleich aus.
viele Grüße
Axel
Hallo du da draußen,
Wenn man nämlich den LI-Elementen Rahmen gibt, stimmt es plötzlich wieder.
Vielen Dank für diesen Hinweis! Das hat mich weitergebracht.
Ebenfalls danke ich den anderen für ihre Antworten.
Grüße von hier drinnen, aus Biberach an der Riss (http://www.stadt-biberach.de/),
Candid Dauth (Dogfish)