CSS Layout - Problem mit Abstand im IE

[lordz]

Hallo zusammen!

In den letzten Tagen habe ich mir ein kleines Layout in CSS zusammengestellt. Leider habe ich nun ein Problem, das wie es der Zufall so will, natürlich nur im IE auftaucht (jedenfalls bei mir)

Das Layout beinhaltet einen Kopfzeile, gefolgt von einer div-box auf der linken Seite sowie einem Content-Bereich. Innerhalb des Content-Bereiches ist auch noch ein weiterer div-Block enhalten.

Zwischen diesen Bereichen soll kein Abstand sein, was im Firefox auch nicht der Fall ist. Im IE befindet sich jedoch zwischen der div-box auf der linken Seite und dem Inhalt des Content-Bereich ein Abstand von ein paar Pixeln. Am besten ist das ganze an der div-Box innerhalb vom Content-Bereich zu sehen.

Da es eine sehr große anzahl an "Tricks" in diesem Bereich gibt, wende ich mich nun hier an euch. Würde mich sehr freuen wenn mir jemand bei diesem Abstands-Problem weiterhelfen könnte.

Den Source findert ihr hier


Grüße
lordz

[ArSeN]

Das Problem hatte ich neulich auch. Da es leider keine richtig gute Lösung dafür gibt habe ich den Content bereich um 2 oder 3 Pixel nach links verschoben (Relativ positioniert). Und schon is die Lücke weg.

Damit das nur im IE so gemacht wird, hab ich den "Tan-Hack" benutzt:

* html #content { ... }

[Kropff]

three pixel text jog

gruß
peter

[ArSeN]

Nachtrag: Das mit dem three pixel text jog hatte ich auch gefunden. Da ich den contentbereich aber 100% groß haben wollte war das irgendwie nich das richtige für mich.

[lordz]

Original geschrieben von ArSeN
Das Problem hatte ich neulich auch. Da es leider keine richtig gute Lösung dafür gibt habe ich den Content bereich um 2 oder 3 Pixel nach links verschoben (Relativ positioniert). Und schon is die Lücke weg.

Damit das nur im IE so gemacht wird, hab ich den "Tan-Hack" benutzt:

* html #content { ... }

Wie genau hast du das ganze denn positioniert? Habe gerade mit margin-left rumprobiert, bin jedoch zu keinem Ergebnis gekommen.

Danke für den "three pixel text jog" Hinweis. Hab mich da auch ein Stück rein gelesen und die höhe des Content-Bereiches einmal auf 1% gesetzt. Hat jedoch keine direkte Auswirkung auf die div-Position des Contents gehabt.


EDIT:
Hab nochmal etwas weiter daran gearbeitet und nun stimmt die Position. Die divs habe ich nun wie folgend definiert:

* html #pageLeftbar {
	position: relative; 
	margin-right: -3px;
}

* html #pageContent {
	margin:0 0 0 147px;
	display:inline-block;
}

Außerdem musste ich das "div" vor "#" entfernen, da der IE damit irgendwie durcheinander gekommen ist.