float im IE6 nicht korrekt
0 0 
Gunnar Bittersmann
0 
molily
float im IE6 nicht korrekt
Hallo,
zu folgendem Code habe ich eine Frage:
<html>
<head>
<style type="text/css">
#container {
width: 32em;
}
label {
clear:left;
float:left;
text-align:right;
width: 10em;
background: yellow;
}
span {
clear:right;
float:right;
font-weight:bold;
width:20em;
background: green;
}
</style>
</head>
<body>
<div id="container">
<label>Dies ist ein etwas längerer Text:</label>
<span>Zeile 1</span>
<label>Dies ist ein etwas längerer Text:</label>
<span>Zeile 2</span>
</div>
</body>
</html>
Es sollen im Prinzip zwei Zeilen erstellt werden. bei einem Zeilenumbruch soll der Text aus dem Span immer direkt neben den Text aus dem Label stehen.
Im Firefox funktioniert das prächtig. Nur der IE6 zerhaut mir meine Ansicht ein wenig. Dh. im IE6 wird der Text Spaltenweise ausgerichtet und nicht Zeilenweise.
Hat jemand einen Tip für mich, dass der Text im IE6 korrekt ausgerichtet wird?
-
Nachtrag:
Ich könnte zwar divs einführen (siehe unten), dies wär für meinen Code etwas umständlich. Gibt es daher eine Möglichkeit per css eine Änderung herbeizuführen?<div> <label>Dies ist ein etwas längerer Text:</label> <span>Zeile 1</span> </div> <div> <label>Dies ist ein etwas längerer Text:</label> <span>Zeile 2</span> </div> -
@@Max M.:
nuqneH
<div id="container">
'div'-Suppe?
<label>Dies ist ein etwas längerer Text:</label>
'label' ist missbraucht:
„Das Element LABEL kann dazu verwendet werden, Steuerelementen Informationen hinzuzufügen. Jedes LABEL-Element ist genau einem Formular-Steuerelement zugeordnet.“ [HTML401 §17.9.1]
Warum verwendest du "ä" anstatt richtiges "ä"?
„Es ist fast immer besser, eine Zeichencodierung zu benutzen, die es erlaubt, die Zeichen in ihrer normalen Form zu verwenden, anstatt Zeichen-Entity-Referenzen oder numerische Zeichenreferenzen zu verwenden.
Die Verwendung von Escapes macht den Quelltext schlechter lesbar und schwerer zu pflegen und kann auch die Dateigröße beträchtlich erhöhen.“ [QA-ESCAPES]
Es sollen im Prinzip zwei Zeilen erstellt werden. bei einem Zeilenumbruch soll der Text aus dem Span immer direkt neben den Text aus dem Label stehen.
Eine Definitionsliste könnte hier angebracht sein.
http://forum.de.selfhtml.org/archiv/2009/5/t186757/#m1240644 ff.
http://forum.de.selfhtml.org/archiv/2009/5/t186757/#m1240655Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)-
Hallo,
vielen Dank für deine Antwort. Hier ein etwas abgewandelter Code:
<html> <head> <style type="text/css"> #container { width: 32em; } .eins { clear:left; float:left; text-align:right; width: 10em; hasLayout: true; } .zwei { clear:right; float:right; width:20em; } </style> </head> <body> <div id="container"> <div class="inhalt"> <div class="eins">Dies ist ein etwas längerer Text:</div> <div class="zwei">Zeile 1</div> </div> <div class="inhalt"> <div class="eins">Dies ist auch ein etwas längerer Text:</div> <div class="zwei">Zeile 2</zwei> </div> </div> </body> </html>Wie kann ich die beiden div.zwei Elemente unten ausrichten lassen, sodass diese direkt neben den Doppelpunkt stehen? Ein einfaches "vertical-align: bottom" auf die klasse inhalt oder den span scheint nicht zu funktionieren.
-
@@Max M.:
nuqneH
Hallo,
vielen Dank für deine Antwort. Hier ein etwas abgewandelter Code:
Divitis.
Dass es außer 'div' noch andere http://de.selfhtml.org/html/text/index.htm@title=Elemente gibt, weißt du?
Wie wär’s denn damit:
<dl> <dt>Dies ist ein etwas längerer Text:</dt> <dd>Zeile 1</dd> <dt>Dies ist auch ein etwas längerer Text:</dt> <dd>Zeile 2</dd> </dl>Wie kann ich die beiden div.zwei Elemente unten ausrichten lassen, sodass diese direkt neben den Doppelpunkt stehen?
Ich hatte dir bereits einen Thread verlinkt, in dem genau das beschrieben ist, was du vorhast (soweit ich auch deiner Beschreibung schlau geworden bin).
Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)
-
-
-
Solche Listen habe ich im IE 6 partout nicht hinbekommen. float und clear beim selben Element funktioniert in dem Fall nicht. Es fehlt ein übergeordnetes Element für das Eintragspaar, dem man das clear gibt. Dann gehts. Deshalb ist der Aufbau von Definitionslisten (dl) auch nicht geeignet.
Wenn das jemand mal mit dl hinbekommen hat, bitte zeigen, das würde mich brennend interessieren, da ich bei einem Projekt mal grandios daran gescheitert bin und die dls nachträglich durch div-hX-div-Konstrukte ersetzen musste.
Mathias