<div> Positionierung funktioniert im IE nicht

Status
Nicht offen für weitere Antworten.
S

stonedjehova

Mitglied
Hallo allerseits,
ich habe da ein kleines Problem. Der folgende Code wird im IE nicht korrekt dargestellt, das, heisst, dass der Querbalken immer 10px dick angezeigt wird.
Im Mozilla funktioniert das aber so...

(Es soll ein Koordinatensystem darstellen)

Code: 
<html>
<head>
<title></title>
</head>
</body>

<!--Die weisse Box als Hintergrund -->
<div align='center' style='position: absolute; top: 50px; left: 20; width: 600px; height: 500px; border-style: outset; border-color: #000066; border-width: 4px; background-color: #FFFFFF;'>
<!-- die senkrechte Achse links -->
<div style='position: absolute; left: 50px; bottom: 40px; width: 2px; height: 400px; background-color: #000066;'>
</div>
<!--Beschriftung der senkr. Achse -->		
<div style='position: absolute; left: 10px; top: 80px;'>
<b>Std.</b>
</div>
<!--Die waagerechte Achse unten -->	
<div style='position: absolute; left: 40px; bottom: 50px; width: 500px; height: 2px; background-color: #000066;'>
</div>
<!--Beschriftung waager. Achse-->	
<div style='position: absolute; right: 50px; bottom: 5px;'>
<b>Monat</b>
</div>

</body>
</html>

hat da jemand vielleicht eine Idee?

Danke

mfg

s.j.
 

Anhänge

Ich glaube das ist eine Kombination aus meinen zwei beliebtesten HTML Problemchen.

1) Zeilenumbrüche im Quelltext interpretiert der Browser als Leerzeichen.

2) Wie bekommt man 1px hohe valide <tr> hin?

Ok kurz zur Erklärung. In (X)HTML sind keine leeren Elemente erlaubt. Das heisst jedes Element, dass du nutzt, muss irgendeinen Inhalt haben und sei es nur ein &nbsp;. Dieser wird aber, wenn du es nicht explizit anders ausdrückst, in der Standardschriftgröße dargestellt. Jetzt hast du zwischen dem <div ...> und </div> Tag einen Zeilenumbruch, also ein Leerzeichen, dass irgendwie in ~10pt oder so angezeigt wird.
Lösung: Setze die Schriftgröße für den Div explizit via CSS auf 0px mit 1px bekommt man nicht immer das dünne Ergebnis, dass man haben will.

Also:
Code: 
<div [...] style="font-size:0px; [...]>&nbsp;</div>

Hoffe, das konnte dir helfen.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück