nicht angemeldet
float:left und IE 5.5
Hello und guten Morgen,
ich habe immer noch ein Problemchen mit dem IE (hier Ver5.5).
Wenn man float:left benutzt, dann verdoppelt der grundsätzlich den margin-left. Der Gecko machts richtig. Leider habe ich gerade keinen IE 6.x.
Könnte mir mal jemand sagen, ob er das da auch macht?
For Copy & Paste only...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Neuer DIV-TEST</title>
</head>
<body>
<style type="text/css">
#boxrahmen
{
position:absolute;
top:5px;
left:5px;
width:100%;
height:100%;
}
#box1
{
position:relative;
margin-left:40px;
width:500px;
height:auto;
}
#box2
{
position:relative;
float:left;
margin-top:25px;
margin-left:20px;
width:150px;
height:auto;
}
#box3
{
position:relative;
float:left;
margin-top:25px;
margin-left:20px;
width:150px;
height:auto;
}
.text
{
position:static;
margin-top:15;
margin-left:20;
}
.dcl
{
position:static;
margin-top:5px;
margin-left:10px;
width:120px;
height:auto;
}
</style>
<div id="boxrahmen" style="background:white; border:solid 2px black;">Rahmen
<div id="box1" style="background:red; border:solid 2px blue;">box1
<div id="box2" style="background:white; border:solid 2px blue;">box2
<div class="dcl"></p>
<p class="text">Dies wird ein neuer Text</p>
<p class="text">Dies wird ein schöner Text, der wird nun
auch mal ein bisschen länger, damit er irgendwo
den Rahmen sprengt und ich sehen, kann,
ob height:auto funktioniert</p>
</div>
</div>
<div id="box3" style="background:white; border:solid 2px blue;">box2
<div class="dcl"></p>
<p class="text">Dies wird ein anderer Text</p>
<p class="text">Es ist ein schöner Text, der nun
auch mal ein bisschen länger ist. Dann kann er sich irgendwie
im Rahmen ausbreiten oder ihn sprengen. Ich kann sehen,
ob float:left funktioniert</p>
</div>
</div>
</div><!--box 1-->
</div><!--boxrahmen-->
</body>
</html>
Grüße
Tom
-
Wenn man float:left benutzt, dann verdoppelt der grundsätzlich den margin-left. Der Gecko machts richtig. Leider habe ich gerade keinen IE 6.x.
Könnte mir mal jemand sagen, ob er das da auch macht?
Der macht das auch. Gehört zu den bekannten Bugs. Dürfte allerdings nur für Angrenzung an die Canvas passieren.
-
Hello,
Wenn man float:left benutzt, dann verdoppelt der grundsätzlich den margin-left. Der Gecko machts richtig. Leider habe ich gerade keinen IE 6.x.
Könnte mir mal jemand sagen, ob er das da auch macht?
Der macht das auch. Gehört zu den bekannten Bugs. Dürfte allerdings nur für Angrenzung an die Canvas passieren.
Danke für den Test.
Gibt es eigentlich noch kein bedingtes CSS? Da könnte man dann doch für jeden Browser einstellen, was er haben will...
Grüße
Tom
-
Danke für den Test.
Hab's nicht getestet. Wie gesagt, der Bug ist bekannt, auch für IE 6 :)
Gibt es eigentlich noch kein bedingtes CSS? Da könnte man dann doch für jeden Browser einstellen, was er haben will...
Es gibt "bedingtes" CSS für Ausgabemedien. "Browser" ist ein solches Medium. Ziel eines Standards kann nicht sein, jedes einzelne Element einer Gruppe gesondert zu bedienen. Wer mal mit einem Senioren-Club im Restaurant war, weiß, wovon ich rede.
-
Hallo,
Gibt es eigentlich noch kein bedingtes CSS? Da könnte man dann doch für jeden Browser einstellen, was er haben will...
für den ie gibt es von ms eine möglichkeit:
<!--[if gte IE 5]> <link href="ie5.css" rel="stylesheet" type="text/css"> <![endif]-->freundl. grüsse aus berlin, Raik
-
-
Hallo,
Wenn man float:left benutzt, dann verdoppelt der grundsätzlich den margin-left. Der Gecko machts richtig. Leider habe ich gerade keinen IE 6.x.
Könnte mir mal jemand sagen, ob er das da auch macht?
Der macht das auch. Gehört zu den bekannten Bugs. Dürfte allerdings nur für Angrenzung an die Canvas passieren.
Gibt es eigentlich noch kein bedingtes CSS? Da könnte man dann doch für jeden Browser einstellen, was er haben will...
Es gibt da "Würgarounds", die CSS-Selectoren einsetzen, welche der IE _noch_ nicht interpretiert. So etwa:
#box2
{
position:relative;
float:left;
margin-top:25px;
margin-left:10px;
width:150px;
height:auto;
}
/* Den nachfolgenden Selector kennt der IE bis Versin 6 _noch_ nicht http://www.w3.org/TR/CSS2/selector.html#child-selectors*/
#box1>#box2
{
margin-left:20px;
}Die Betonung liegt dabei auf _noch_. Das zeigt, wie wenig Zukunftssicher solche Geschichten sind. Wenn Du wissen willst, warum ich es aufgegeben habe, in HTML-Seiten solche CSS-Spielchen einzusetzen, dann schau Dir Deine Konstruktion mal spassenshalber im Opera6.x an ;-)).
viele Grüße
Axel
-
Hello Axel,
Es gibt da "Würgarounds", die CSS-Selectoren einsetzen, welche der IE _noch_ nicht interpretiert. So etwa:
/* Den nachfolgenden Selector kennt der IE bis Versin 6 _noch_ nicht http://www.w3.org/TR/CSS2/selector.html#child-selectors*/
#box1>#box2
{
margin-left:20px;
}schau Dir Deine Konstruktion mal spassenshalber im Opera6.x an ;-)).
Sollte ich das besser VOR oder NACH dem Essen tun?
Grüße
Tom
-
Hallo Tom,
schau Dir Deine Konstruktion mal spassenshalber im Opera6.x an ;-)).
Sollte ich das besser VOR oder NACH dem Essen tun?
Das kommt auf die Empfindlichkeit Deines Magens an ;-))
Was ich sagen wollte war:
HTML ist zur Erstellung von Seiten-Layouts und Bildschirm-Layouts nicht geeignet, auch zusammen mit CSS nicht. Völig ungeeignet sind diese Sprachen für pixelgenaue Layouts. Nutzt man es trotzdem dafür, so wird dieses Layout _niemals_ _sicher_ bei allen Nutzern funktionieren, weil es _keinen_ Browser gibt, bei dem man sich absolut auf die Einhaltung der Standards verlassen kann. Das bedeutet dann:
- HTML und CSS standardkonform schreiben
- Testen in allen gängigen Browsern
- Workarounds für Browser-Bugs einbauen
- Seite veröffentlchen
- Workarounds aktualisieren, wenn Browser aktualisiert werden
...
HTML beschreibt und strukturiert Hyper-Text-Dokumente. CSS beschreibt das Aussehen und teilweise das Verhalten von HTML-Elementen. So eingesetzt, sollte das Hyper-Text-Dokument mit allen Browsern erreichbar und lesbar sein. Eine Garantie auf Deckungsgleichheit gibt es nicht.
Zum konkreten Problem:
HTML bietet _kein_ Element zum Strukturieren von mehrspaltigem Textfluss. Das Element DIV ist ein allgemeines, nicht weiter definiertes Blocklevel-Element. Es ist _kein_ Container zum Layouten von Elementen in seinem Inhalt und auch _kein_ Canvas, um etwas darauf zu zeichnen. Die CSS-Eigenschaft "float" ist für die Regelung des Textumflusses von Elementen _im_ Fließtext (Bilder, Tabellen) gedacht. Daraus folgt: Dein Vorhaben ist mit HTML und CSS nicht lösbar.
viele Grüße
Axel
-
Hi,
Zum konkreten Problem:
HTML bietet _kein_ Element zum Strukturieren von mehrspaltigem Textfluss. Das Element DIV ist ein allgemeines, nicht weiter definiertes Blocklevel-Element. Es ist _kein_ Container zum Layouten von Elementen in seinem Inhalt und auch _kein_ Canvas, um etwas darauf zu zeichnen. Die CSS-Eigenschaft "float" ist für die Regelung des Textumflusses von Elementen _im_ Fließtext (Bilder, Tabellen) gedacht. Daraus folgt: Dein Vorhaben ist mit HTML und CSS nicht lösbar.
Noch nicht. CSS3 wird mehrspaltigen Element-Inhalt unterstützen. Aber das kann noch dauern, bis das ne Recommendation ist und das auch in den Browsern implementiert ist...
cu,
Andreas--
Der Optimist: Das Glas ist halbvoll. - Der Pessimist: Das Glas ist halbleer. - Der Ingenieur: Das Glas ist doppelt so groß wie nötig.
http://mud-guard.de/? http://www.andreas-waechter.de/ http://www.helpers.de/
-
-
-
-