IE6 Problem

[tomjons]

Hallo,

habe gerade mit entsetzen festgestellt, das im IE6 mein Layout "entstellt" ist.
Habe zwei Screenshots von IE7 (ok) und IE6 angehängt. Lt. Dreamweaver gibt es im CSS keinerlei Probleme hinsichtlich IE6.

Trotzdem hier ein Ausschnitt:

#maincontent {
width:995px;
background:#ffffff;
}

#leftmenu {
position:relative;  
width:202px;
right:0px;
float: left;
}

#content {
position:relative;  
width:560px;
float:left;
padding-left:15px;
padding-right:16px;
}

#rightmenu {
position:relative;  
width:202px;
right:0px;
float:left;
}

Vielleicht sieht ja jemand schon auf Anhieb einen Fehler.

Danke

[Baskosehund]

Floate die rechte seite doch auch rechts.

[tomjons]

Danke! Jetzt ist sie zumindest rechts bündig.

Jedoch schliesst die Oberkante vom "rightmenu"
jetzt immer mit der Unterkante vom "maincontent" ab.

Also je nach Inhalt ziemlich weit unten.

[Baskosehund]

Mhhh... nimm doch dem "content" das Float weg. Der Soll ja nur die Mitte Ausfüllen. Damit er die linke und rechte box nicht umfließt wenn er länger ist musst du dann noch den abstand links und rechts festlegen.

[tomjons]

Hallo,

hab deine Antwort erst heute gelesen und den Rat befolgt. Der Code sieht jetzt so aus. Jedoch hängt die "Rechte Leiste" in IE6 immer noch am unteren linken Ende vom "content". Die Abstände sind ja mit padding definiert.

#maincontent {
width:995px;
background:#ffffff;
}

#leftmenu {
position:relative;  
width:202px;
right:0px;
float: left;
}

#content {
position:relative;  
width:560px;
padding-left:15px;
padding-right:16px;
}

#rightmenu {
position:relative;  
width:202px;
right:0px;
float:left;
}

[skyborg]

Hallo, ich würde das so machen:

#maincontent { margin:0 auto; width:995px; background:#fff; border-style:solid; border-color:#fff; border-width:0px 0px 0px 0px; }
#leftmenu { float:left; width:202px; }
#content { float:left; width:560px; background-color:#fff; border-style:solid; border-color:#fff; border-width:0px 0px 0px 0px; }
#rightmenu { float:right; width:202px; }

(border entsprechen anpassen)

<div id="maincontent">
<div id="leftmenu">{$boxes}</div>
<div id="rightmenu">{$boxes</div>
<div id="content">{$main_content}</div>
</div>
<Clear>

Wenn es sich tatsächlich um ein reines IE6-Problem handeln sollte, dann kann man das wie folgt lösen (Beispiel):
#xyz { css:123; }
* html #xyz { css:456; }

Gruß

[tomjons]

Hallo,

erstmal Danke für deinen Beitrag.

Aber dass

#xyz { css:123; }
* html #xyz { css:456; }

versteh ich nicht ganz.

Muss ich hier in mein bestehendes Stylesheet was einfügen?

[John Steed]

versteh ich nicht ganz.

Brauchst Du auch nicht - was skyborg da vorschlägt ist der sogenante "Star HTML Hack" (Gurgel mal danach), der einen Bug des IE 5/6 unter Windows ausnutzt.

Meiner Meinung nach sind CSS-Hacks, die Browserfehler voraussetzen keine gute Lösung. Microsoft selbst rät vom Einsatz solcher Techniken ebenfalls ab und empfiehlt eine zwar hemdsärmelige, aber immerhin standardkonforme Technik, den eigenen Browsern angepasste CSS-Dateien unterzuschieben. Das ganze nennt sich "Conditional Comments", wie's funktioniert findest Du u.a. in SelfHTML

In der Praxis sieht das dann so aus, dass Du zunächst wie gewohnt die komplette CSS-Datei auf "herkömmlichem Weg" einbaust und dann *danach* per Conditional Comment eine (oder mehrere, je nachdem wieviele IE-Versionen Du extra bedienen willst) weitere CSS-Datei einbindest, die *nur* die Formatierungen in angepasster Form enthält, die der IE in der "grossen" Datei wirklich falsch versteht. Das sind in der Regel nur wenige Zeilen. IMHO besser und sauberer als alle "Hacks"...

Cheers,
IaN

PS: @skyborg - warum bei der border nicht einfach border:none; - ist doch viel kürzer

[skyborg]

Es gibt nun mal für jede Lösung mehrere Wege. Ob jemand einen Hack einsetzt oder nicht, ist Ansichtssache. Ebenso die Meinungen von Winzigweich. Die gestellte Anfrage findet ihre Antwort auch ganz bestimmt nicht in einem Hack, sondern in ganz normalen CSS ohne irgendwelche Sondermaßnahmen.

Zur Anmerkung:

PS: @skyborg - warum bei der border nicht einfach border:none; - ist doch viel kürzer

Einfach mal genauer und alles lesen, denn das steht auch noch in meinem Text:

(border entsprechen anpassen)

[John Steed]

Ob jemand einen Hack einsetzt oder nicht, ist Ansichtssache.

Jup. Soll doch jeder machen, was er für richtig hält Nur nochmal der Hinweis, das M$ selbst vom Einsatz - zugegebenermassen - langjährig erprobter Hacks abrät. Eine schöne Erklärung und Ausblicke auf die Zukunft findet der Interessierte hier: http://msdn.microsoft.com/en-us/library/bb250496.aspx

Die CC-Variante hat den unbestrittenen Vorteil, dass man sehr fein auf unterschiedliche IE-Varianten eingehen kann (den 5er IE gibt's ja auch immer noch...) und das wirklich *nur* der IE diese Comments interpretiert. Somit "lässt man alle anderen Browser damit in Ruhe" - vielleicht gibt's ja noch andere Browser, die anderes mit den Hacks anstellen... Und besser als alle JavaScript-Browserweichen von vor 10 Jahren ist das allemal...

Ebenso die Meinungen von Winzigweich.

Ich sehe hier keine Meinungen von "winzigweich" - meinst Du einen anderen Thread?

Einfach mal genauer und alles lesen, denn das steht auch noch in meinem Text:

OT und tomjons wird's wohl auch nur beschränkt bei seinem Problem helfen, aber auch das geht kürzer

border:solid 1px #000000;

macht dassselbe wie

border-style:solid;
border-width:1px;
border-color:#000000;

Aber: Wie eingangs schon erwähnt, soll doch jeder machen, was er für richtig hält Ich bin nunmal der W3C-/Standardkonform/No-Hacks-Geek und Browser sind sowieso alle doof

@tomjons: Was Du Dir einmal durchlesen solltest, sind folgende Links in SelfHTML, damit Du erfährst, warum der IE so komische Sachen macht:
http://de.selfhtml.org/css/formate/b...#box_model_bug
http://de.selfhtml.org/css/layouts/b...htm#empfehlung

Im zweiten Artikel ganz am Ende:

Auf der sicheren Seite sind Sie, wenn Sie nach Möglichkeit weitestgehend auf den Einsatz von CSS-Hacks verzichten.

So, muss jetzt los zur Weihnachtsfeier meiner Agentur...

Cheers,
IaN