IE verschiebt Tabelle nach links

[slosd]

wenn man jetzt z.b die Seite http://leber.le.funpic.de/sFreeDownload/?l=1&t=1 hernimmt werden im IE nach dem Menü alle Tabellen mit den Downloads drinn an den linken Rand gestellt (im Beispiel ab "PHP Designer 2006")
Wie kann ich das verhindern bzw. ausbessern ?

 

[planet4]

hallo,
du hast die Container nicht richtig gefloatet:
du musst #navigation ein float:left geben und #page ein float:right, dann
stehen sie wirklich nebeneinander; außerdem braucht #page eine Breite,
sonst stellen manche Browser (siehe IE) das beliebig breit dar. (mit
ungefähr 83% bekommst du vielleicht die richtige Breite?)

dann musst du noch direkt nach dem #page-Container ein
<div style="width: 1px;clear:both;"></div>
einfügen, d.h.: du musst den float clearen, damit der #cl-Container auch
wirklich bis nach unten geht
(das "width: 1px" ist wieder mal ein Zugeständnis an IE, da er hier eine festgelegte
Dimension braucht )

planet4.

 

[slosd]

hallo,
du hast die Container nicht richtig gefloatet:
du musst #navigation ein float:left geben und #page ein float:right, dann
stehen sie wirklich nebeneinander; außerdem braucht #page eine Breite,
sonst stellen manche Browser (siehe IE) das beliebig breit dar. (mit
ungefähr 83% bekommst du vielleicht die richtige Breite?)

dann musst du noch direkt nach dem #page-Container ein
<div style="width: 1px;clear:both;"></div>
einfügen, d.h.: du musst den float clearen, damit der #cl-Container auch
wirklich bis nach unten geht
(das "width: 1px" ist wieder mal ein Zugeständnis an IE, da er hier eine festgelegte
Dimension braucht )

planet4.

Das haut mir das ganze layout durcheinander. #page hat absichtlich keine Breite damit diese sich auf den verfügbaren Platz ausdehnt (der Browser bildet die Breite keinesfalls per Zufall).
Konnte mir leider nicht weiterhelfen.

 

[planet4]

es haut dir nicht alles durcheinander, du musst nur die Container richtig anordnen...

schau dir die Screenshots an:
deinem #page-Container hab ich einen roten Rand gegeben, da siehst du den Unterschied,
wie Firefox und IE es darstellen:
IE macht ihn viel zu breit, daher werden die später folgenden Tabellen viel weiter links angeordnet.

Hier übrigens steht viel über float und da findest
du auch, dass float unbedingt eine Breite braucht.

planet4.

 

[slosd]

Hier übrigens steht viel über float und da findest
du auch, dass float unbedingt eine Breite braucht.

Gemäß CSS2.1 (und der tatsächlichen Umsetzung durch die Browser) ist dies nicht mehr erforderlich; die Breite richtet sich in diesem Fall nach dem Inhalt.

So danke für die Bemühung dieses Problem zu lösen, aber ich hab jetzt eine funktionierende Lösung gefunden.
einfach ein padding-left:200px (das ist die Breite des Menüs + Abstand zum Inhalt) zum #page dazugefügt. Allerdings nur für den IE (mit * html).

Was mich jetzt allerdings wundert, ist dass bei deinen Screenshots alle Grafiken nicht angezeigt werden; oder täusch ich mich da ?

 

[planet4]

ja, gut wenn du es so gelöst hast.

An dem Screenshot vom IE hast du aber sehen können, dass der Browser nicht unbedingt weiß,
wie breit er den Container machen soll. (vielleicht kann er kein CSS2.1?)

das mit den Grafiken: mach dir keine Gedanken, das war nur ein Sreenshot um die Ausmaße des
Containers zu sehen, die Grafiken spielten da keine Rolle.

planet4.

 

[slosd]

ich rede von allen grafiken auf meiner Seite. Auf deinem Screenshot werden die alle nicht angezeigt.

 

[planet4]

ich rede von allen grafiken auf meiner Seite. Auf deinem Screenshot werden die alle nicht angezeigt.

ja, ich rede ja auch von allen Grafiken.
natürlich werden sie nicht angezeigt, weil ich sie nicht hier hab
Vorgehensweise: ich kopier mir kurz deinen Quelltext und die Css-Datei, ich ändere die Css-Datei so,
dass der betreffende Container einen roten Rand bekommt, damit man ihn sieht, ich ruf die
Datei auf meinem localhost im IE und im Firefox auf und mach nen Sreenshot - that's all

es ging ja nur um die Ausmaße des Containers, wie der IE ihn fälschlicherweise anzeigt, im Vergleich
zur richtigen Anzeige im FF

planet4.

 

[slosd]

aso. Du hast den Quelltext kopiert. Ich dachte du hast in irgendeinem Programm einen Rahmen drum gezogen. Dann ists klar :whacky: