nicht angemeldet
float-Problem im IE
Hallo,
ich hab mal wieder ein CSS-Problem mit dem IE. Und zwar werden die Abstände von einem DIV (Navigation) anders, wenn es die Eigenschaft "float: left" bekommt.
Navigation mit float:
http://alex.ilosuna.org/xhtml/index.html
...und ohne float (hier Stimmt die Position der Navigation):
http://alex.ilosuna.org/xhtml/index2.html
Woran liegt das?
Und dann werden im IE noch ein paar andere Sachen nicht so dargestellt, wie ich's gerne hätte (Abstände der Links, "a:before") aber das kann man wahrscheinlich nicht erwarten...
In Mozilla und Opera sieht's so aus, wie ich's will (Opera versteht soger "a:hover:before").
Schon mal Danke und Grüße: Alex
-
Hi Alex,
hoffe das hilft dir was. Also ich hatte auch das Problem und du musst dem Ding einfach allen divs ein float:left geben und wenn die "zeile" vorbei ist dann gibst du dem letzten div ein float:clear. Das funzt. Dann ist das sozusagen ein Zeilenumbruch.
Was ich noch besser finde ist die Positionierung mit position:absolute. Da kannst jedes div genau positionieren und auch variabel für fenster-größen machen.
schau mal auf:
http://www.fractatulum.de/fraccss/sample/layout3format.htm
Hier ist das erklärt.
bei dem zweiten Problem kann ich dir auch nicht helfen. Da bin ich auch am IE verzweifelt.
mfg
.mase
-
Hallo,
Was ich noch besser finde ist die Positionierung mit position:absolute. Da kannst jedes div genau positionieren und auch variabel für fenster-größen machen.
schau mal auf:
...das möchte ich aus dieesem Grund nicht so machen:
http://alex.ilosuna.org/xhtml/layout5.htm
-->bei wenig Text rutscht die Fußzeile unter die Navigation.Grüße: Alex
-
Hallo,
hoffe das hilft dir was. Also ich hatte auch das Problem und du musst dem Ding einfach allen divs ein float:left geben und wenn die "zeile" vorbei ist dann gibst du dem letzten div ein float:clear. Das funzt. Dann ist das sozusagen ein Zeilenumbruch.
...gibt es "float: clear" überhaupt? Ich kenne nur "clear:left/right". Und ändern tut es leider auch nichts:
http://alex.ilosuna.org/xhtml/index3.htmlGrüße: Alex
-
-
Hallo Alex,
Ohne jetzt auf Dein IE-Problem eingehen zu können... (mangels verfügbarem IE)
In Mozilla und Opera sieht's so aus, wie ich's will (Opera versteht soger "a:hover:before").
Mozilla versteht es auch - es heißt aber immer noch a:before:hover. (Pseudoelemente kommen immer vor Pseudoklassen)
Christian
--
Hast Du einen Beitrag? Nur her damit!
http://aktuell.de.selfhtml.org/tippstricks/beitrag.htm
SELF-Code: (http://emmanuel.dammerer.at/selfcode.html)
sh:) fo:) ch:] rl:( br:> n4:& ie:% mo:) va:) de:] zu:) fl:( js:| ss:) ls:[-
Hallo,
In Mozilla und Opera sieht's so aus, wie ich's will (Opera versteht soger "a:hover:before").
Mozilla versteht es auch - es heißt aber immer noch a:before:hover. (Pseudoelemente kommen immer vor Pseudoklassen)
...OK, aber machen tut er's trotzdem nicht.
Grüße: Alex
-
-
Hallo, Alex,
ich hab mal wieder ein CSS-Problem mit dem IE. Und zwar werden die Abstände von einem DIV (Navigation) anders, wenn es die Eigenschaft "float: left" bekommt.
Navigation mit float:
http://alex.ilosuna.org/xhtml/index.htmlWoran liegt das?
Der Internet Explorer verdoppelt den margin-left-Wert komischerweise, ich kann es mir auch nicht erklären, es ist mir auch noch nie begegnet und ich finde keine Ursache.
Ein Workaround wäre, ein Container-Element einzufügen:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>XHTML-Test</title>
<style type="text/css">
html,body {margin:0; padding:0;}
#navcontainer {float:left; margin:0; padding:0; background-color:#eee;}
#nav {margin:0 0 0 10px; padding:0; width:200px; height:400px; background-color:#ccc; font-size:13px; border:0 solid black;}
#content {margin:0 10px 0 230px;}
</style>
</head>
<body><div id="navcontainer">
<div id="nav"></div>
</div><p id="content">blabla ... blabla</p>
</body>
</html>Und dann werden im IE noch ein paar andere Sachen nicht so dargestellt, wie ich's gerne hätte (Abstände der Links, "a:before") aber das kann man wahrscheinlich nicht erwarten...
li {display:none} verhindert im MSIE die Abstände zwischen den li-Elementen, welche die a-Blockelemente enthalten... eine andere Möglichkeit habe ich nicht gefunden.
Grüße,
Mathias