Problem Layout mit IE 6.0

Hallo Community.

Ich habe hier folgendes Problem und zwar am Besten ihr schaut euch den Link an:
http://websites.m2itsolutions.at/test/

Das Layout passt in allen Browser, sprich FF, Opera, Chrome, Safari, IE 7 / 8. Jedoch leider nicht in IE 6.0.

Die Transparenz links in #framecontentLeft funktioniert nicht, da weiß ich aber schon die Lösung.

Jedoch das größere Problem finde ich, dass der IE 6.0 das Hintergrund-Bild nicht über die ganze Seite legt.
Auch finde ich es störend, dass ein vertikaler Scrollbalken erscheint.
Warum zeigt der IE 6.0 auch das #mainContent-div nicht an? Bzw. es steckt hinter dem Hintergrundbild. Z-index habe ich ja richtig gesetzt.

Könnt ihr mir bitte helfen?

Mit besten Dank.

Sebastian

Moin,

ich habe hier einen T-Online-Browser 6.0, der auf IE6 basieren soll. Da sieht die Seite genauso aus, wie im Firefox.

Das Hintergrundbild sehe ich in beiden Browsern nicht über der ganzen Seite, es liegt hinter div#maincontent.

Der vertikale Scrollbalken, den ich im T-Online-Browser sehe, ist grau, d.h. inaktiv. Ich glaube mich zu erinnern, dass der IE das immer so macht, während Firefox gar keinen Scrollbalken anzeigt, wenn keiner benötigt wird.

Ein div #mainContent gibt es übrigens nicht.

Problematisch an Deiner Seite sehe ich aber die unsägliche div-Suppe, die Du kochst. Eine richtige Webseite setzt HTML zur Auszeichnung der logischen Struktur (= Semantik) ein. Das Tag hat dabei die Bedeutung „Gruppe mehrerer Elemente“. Du setzt aber durchgehend überall ein, auch da, wo es keine zwei, sondern nur ein Element enthält. Da sind s dann überflüssig.
An den ID-Bezeichnungen erkenne ich, dass Du erst kürzlich von Frames umgestiegen bist. Damit hast Du vermutlich noch die kranken Denkweisen von Frames im Kopf. Daher kommt vielleicht auch, dass Du glaubst, man mache Layout mit divs. Dem ist natürlich nicht so.

Aber solange Du keinen Inhalt hast, kannst Du natürlich keine richtige Auszeichnung mit HTML machen. Aber solange Du keine valide und semantisch sinnvolle Basis aus HTML hast, lohnt es sich nicht, sich auf CSS zu stürzen, weil das die Voraussetzung für CSS ist. Du machst quasi den dritten Schritt vor dem ersten und zweiten. Damit wirst Du auf viele Probleme stoßen, die Du bei Einhaltung der richtigen Reihenfolge nicht hättest. Wenn Du HTML mal kannst, dann kannst Du auch wieder andersrum anfangen, aber als Anfänger in Sachen HTML&CSS wirst Du Dich auf die Weise sehr oft verstricken in scheinbar sinnlosen Problemen. CSS wird Dir nicht sehr einfach und logisch vorkommen. Aber diese Probleme sind hausgemacht.

Denk mal drüber nach.

Liebe Grüße,
-Efchen

Hi Efchen.
Vorab danke für deine Antwort.

ich habe hier einen T-Online-Browser 6.0, der auf IE6 basieren
soll. Da sieht die Seite genauso aus, wie im Firefox.

Ok mag sein.

Das Hintergrundbild sehe ich in beiden Browsern nicht über der
ganzen Seite, es liegt hinter div#maincontent.

So soll es auch sein, nur bei der Startseite erscheint das Bild über der ganzen Seite. Später erscheint dann div#maincontent.

Der vertikale Scrollbalken, den ich im T-Online-Browser sehe,
ist grau, d.h. inaktiv. Ich glaube mich zu erinnern, dass der
IE das immer so macht, während Firefox gar keinen Scrollbalken
anzeigt, wenn keiner benötigt wird.

Ok, keine Ahnung, habe den T-Online-Browser nicht.

Ein div #mainContent gibt es übrigens nicht.

Hä? Ich seh da aber eines -

Problematisch an Deiner Seite sehe ich aber die unsägliche
div-Suppe, die Du kochst. Eine richtige Webseite setzt HTML
zur Auszeichnung der logischen Struktur (= Semantik) ein. Das
Tag hat dabei die Bedeutung „Gruppe mehrerer Elemente“.
Du setzt aber durchgehend überall ein, auch da, wo es
keine zwei, sondern nur ein Element enthält. Da sind s
dann überflüssig.
An den ID-Bezeichnungen erkenne ich, dass Du erst kürzlich von
Frames umgestiegen bist. Damit hast Du vermutlich noch die
kranken Denkweisen von Frames im Kopf. Daher kommt vielleicht
auch, dass Du glaubst, man mache Layout mit divs. Dem ist
natürlich nicht so.

Nene dem ist nicht so, nur mach ich eigentlich meine Layouts immer mit divs. In den jeweiligen Divs stehen dann die richtigen HTML-Tags für die Textgestaltung, etc.

Ich habe die ids nur nicht unbenannt, weil ich dieses Template für die Seite verwendet habe:
http://www.dynamicdrive.com/style/layouts/item/css-l…. Bevor ich das angehe, möchte ich, dass die Seite in jedem Browser einwandfrei funktioniert.

Aber solange Du keinen Inhalt hast, kannst Du natürlich keine
richtige Auszeichnung mit HTML machen. Aber solange Du keine
valide und semantisch sinnvolle Basis aus HTML hast, lohnt es
sich nicht, sich auf CSS zu stürzen, weil das die
Voraussetzung für CSS ist. Du machst quasi den dritten Schritt
vor dem ersten und zweiten. Damit wirst Du auf viele Probleme
stoßen, die Du bei Einhaltung der richtigen Reihenfolge nicht
hättest. Wenn Du HTML mal kannst, dann kannst Du auch wieder
andersrum anfangen, aber als Anfänger in Sachen HTML&CSS wirst
Du Dich auf die Weise sehr oft verstricken in scheinbar
sinnlosen Problemen. CSS wird Dir nicht sehr einfach und
logisch vorkommen. Aber diese Probleme sind hausgemacht.

Denk mal drüber nach.

Ok, habe darüber nachgedacht, aber ich denke, dein T-Online-Browser basiert nicht auf dem IE6. Denn ich habe mal schnell einen Screenshot meines IE6.0 gemacht (unter WinXP).
Hier der Link:
http://websites.m2itsolutions.at/test/screenshot_ie6…

Verstehst du jetzt was ich meine - alle vorher beschriebenen Fehler existieren.

Freundliche Grüße,
Sebastian

Hab die Lösung selbst rausgefunden und zwar habe ich:
Die css Hacks die nur für den IE gegolten haben, geändert und zwar:

* html body{ /*IE6 hack*/
padding: 0; /*Set value to (HeightOfTopFrameDiv 0 0 WidthOfLeftFrameDiv)*/
}
* html #framecontentTop .innertube{ /*IE6 hack*/
margin-right:230px;
}
* html #maincontent .innertube{ /*IE6 hack*/
margin-right:230px;
}

Nun habe ich den Hintergrund über die gesamte Seite.

Die Transparenz in der linken Spalte habe ich mittels:

erreicht.

Der Scrollbalken Rechts ging automatisch durch die Anpassung weg.

Freundliche Grüße,
Sebastian

Ein div #mainContent gibt es übrigens nicht.

Hä? Ich seh da aber eines -

Naja, #maincontent, vorher schriebst Du aber von #mainContent. Klar, Windows sieht den Unterschied nicht, aber das ist ja auch dumm. Du siehst ihn schon, oder? :smile:

Nene dem ist nicht so, nur mach ich eigentlich meine Layouts
immer mit divs.

Naja, genau das ist aber falsch.

In den jeweiligen Divs stehen dann die
richtigen HTML-Tags für die Textgestaltung, etc.

Naja, aber so hast Du div-Suppe, die viel zu viele divs enthält und total unübersichtlich ist.

Bevor ich das angehe, möchte ich, dass die Seite in jedem
Browser einwandfrei funktioniert.

Warum nur in jedem Browser? Was ist mit den anderen Clients? :smile:

Ok, habe darüber nachgedacht, aber ich denke, dein
T-Online-Browser basiert nicht auf dem IE6.

Doch, tut er, ich habe nachgesehen.
http://www.softwareload.de/c/11/05/83/38/11058338.html
Aber es scheint wohl doch Unterschiede zu geben…

Verstehst du jetzt was ich meine - alle vorher beschriebenen
Fehler existieren.

Ja, ich denke, das hab ich auch schon vorher.
Im IE8 in der Kompatibilitätsansicht, die doch - so dachte ich - den IE6 emuliert, tritt das Problem aber auch nicht auf.

Einen z-index-Bug scheint es nicht zu geben. position verwendest Du für die beteiligten Elemente, weil das ja Voraussetzung für z-index ist.

Könnte das helfen, ist zwar mit hover, aber das mit dem transparenten Backround?
http://xhtmlforum.de/34099-z-index-ndern-bei-hover-f…

Naja, #maincontent, vorher schriebst Du aber von #mainContent.
Klar, Windows sieht den Unterschied nicht, aber das ist ja
auch dumm. Du siehst ihn schon, oder? :smile:

Ok, das mag stimmen, ich sehe den Unterschied! :smile:

Naja, genau das ist aber falsch.

Wie würdest du es angehen? Wie machst du deine Layouts?

Naja, aber so hast Du div-Suppe, die viel zu viele divs
enthält und total unübersichtlich ist.

Das stimmt, wenn ich den Quelltext direkt im Browser ansehe, aber ich habe da verschiedenste Tools, die mir helfen den Quelltext schön hierarchisch zu strukturieren (zB Adobe Dreamweaver CS4, Zend Framework, Firebug, …).

Warum nur in jedem Browser? Was ist mit den anderen Clients?

-)

*hehe* Das würde ja eine endlose Geschichte werden.
Ich prüfe bei meinen Layouts jeweils mit den Browsern FF, Chrome, Safari, IE 6-8, Opera und das jeweils bei den Betriebssystemen Ubuntu, WinXP, WinVista, Win7 und MacOS. Ich würde meinen das reicht. :smile:

Wie machst du das?

Doch, tut er, ich habe nachgesehen.
http://www.softwareload.de/c/11/05/83/38/11058338.html
Aber es scheint wohl doch Unterschiede zu geben…

Ich habe extra für den IE 6 einen Virtuellen PC angelegt mit WinXP und IE6. Hier kann ich sicher sein, dass das der IE6.

Ja, ich denke, das hab ich auch schon vorher.
Im IE8 in der Kompatibilitätsansicht, die doch - so dachte ich

  • den IE6 emuliert, tritt das Problem aber auch nicht auf.

Was ich weiß ist, dass der IE8 in der Kompatibilitätsansicht der IE7 ist.

Einen z-index-Bug scheint es nicht zu geben. position
verwendest Du für die beteiligten Elemente, weil das ja
Voraussetzung für z-index ist.

Stimmt, den Bug gibt es nicht, habe auch darüber gegoogelt.

Danke für deine Antwort.

Bis bald.

LG Sebastian

Naja, genau das ist aber falsch.

Wie würdest du es angehen? Wie machst du deine Layouts?

Mit CSS.

Anfängern empfehle ich, strikt in dieser Reihenfolge vorzugehen:

  1. Inhalt schreiben.
  2. Inhalt semantisch sinnvoll mit HTML auszeichnen.
  3. Layout und Design darauf aufsetzen.

Wenn man alles richtig geplant hat, muss man nie wieder von einem Schritt zurück zu einem andere gehen.

Wenn man Fortgeschritten ist, darf man bei Schritt 2 auch schon an Schritt 3 denken. Anfängern empfehle ich, HTML immer und überall strikt von CSS zu trennen, auch und bei Anfängern vor allem in Gedanken!
Fortgeschrittene sind da besser in der Lage zu differenzieren. Aber Fortgeschritten ist nur, wer weiß, was Semantik ist, dass das das einzige Ziel von HTML ist, und dass HTML nichts mit der Darstellung zu tun hat.

Warum nur in jedem Browser? Was ist mit den anderen Clients?

-)

*hehe* Das würde ja eine endlose Geschichte werden.

Wieso? Ich meinte das ernst. Außerdem meinte ich Clients, die nicht Browser sind. Also Suchmaschinen und Vorlesebrowser und was es sonst noch gibt oder geben wird.

Ich prüfe bei meinen Layouts jeweils mit den Browsern FF,
Chrome, Safari, IE 6-8, Opera und das jeweils bei den
Betriebssystemen Ubuntu, WinXP, WinVista, Win7 und MacOS. Ich
würde meinen das reicht. :smile:

Wo ist in Deiner Liste Lynx? Vorlesebrowser? Zwei sehr wichtige Vertreter, die viel abdecken.

Wie machst du das?

Ich versuche einfach, anständigen Code zu schreiben und verzichte, auf hochkomplizierte Layouts (bin eh eine Niete in Design :smile:) und habe keine Probleme damit, wenn etwas in einem Browser aufgrund von Browserschwächen mal anders aussieht, als in anderen.

Grüße,
-Efchen