|
|||
Container / Float-Problem mit IE 5-6
Es geht um folgende Seite: Link
Das Problem ist, dass die Tabelle mit den Daten sehr breit ist und daher bei Standard-Auflösungen wie 1024*768 die Fensterbreite nicht ausreicht. Kleiner kann ich aber die Tabelle auch nicht machen. IE 7, FF, Opera & Co. haben damit wenig Probleme, aber bei IE 5-6 wird der rechte Container (col_right) nach unten verschoben, d.h. der Container fängt erst an, wo der linke Container (col_left) aufhört. Kann mir jemand weiterhelfen, denn irgendwie stehe ich auf dem Schlauch, was ich machen muss, damit auch der IE 6 (und ggf. IE 5.5 / IE 5) den Container nicht verschieben? Danke im Voraus Frank-Andre
__________________
Credendo Vides |
Sponsored Links |
Sponsored Links |
|
|||
Überbreite Tabellen bei Float sind ein grundsätzliches Problem im IE < 7.
Vor längerer Zeit hatte ich mal ein Beispiel gepostet, bei dem der IE sich ähnlich wie andere Browser verhält. http://xhtmlforum.de/41803-fusszeile...tml#post306981 Du könntest auch die Tabelle mit einem div einschließen, diesem 100%-Breite geben und dort scrollen. |
|
||||
Das ist klar. Schade, daß der IE 5.x body so "stiefmütterlich" behandelt, das wäre perfekt gewesen (im IE 6 geht's ja auch mit body). Wobei man meistens (so auch im konkreten Fall) ja doch ein entsprechendes umgebendes Element hat.
|
|
|||
Danke, das werde ich mir mal genauer und in Ruhe anschauen müssen. Bin mal gespannt!
Vor allem muss das dann auch die anderen Seiten richtig anzeigen, denn die Layout-Templates sind übergreifend und nicht nur für die Seiten mit Tabellen. CU Frank-Andre
__________________
Credendo Vides |
|
|||
Sollte hoffentlich in den "normalen" Seiten erst recht funktionieren.
Ich hab das Prinzip hier nochmal auf deine Spalten angewendet, damit dürfte es leichter umzusetzen sein. Das etwas merkwürdige Verschieben der linken Spalte (neg. rechter Margin + rel. Pos.) ist ein Versuch; beim Verschieben mit negativem linken Margin neigt der IE zu "hüpfenden" Spalten. Wäre nett, wenn du's mal testen würdest und ein Feedback zur Stabilität gibst. Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"> <head> <title>xxx</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" /> <style type="text/css"> * { margin:0; padding:0; } body { background:yellow; } #content { background:#fff; /* containing floats + layout for IE */ float:left; width:100%; } #col_left { float: left; width: 238px; background:red; } #col_right { margin-left: 280px; margin-right: 2px; background:green; } #content table { width:150%; } #content td { border:1px solid black; } /* anti IE-drop */ * html #content { border-left:280px solid #fff; margin:0; padding:0; float:none; width:auto; height:1px; } * html #col_left { margin-right:-238px; position:relative; right:280px; } * html #col_right { margin:0; float:left; width:100%; } </style> </head> <body> <div id="content"> <div id="col_left"> Linke Spalte<br />.<br />. </div> <div id="col_right"> Inhaltsbereich <table> <tr> <td>Zelle</td> </tr> </table> </div> </div> </body> </html> |
|
|||
Klappt Super !!!! Danke!!!
ich habe Deine CSS-Angaben in eine separate ie.css eingetragen, die über Browserweiche nur beim IE 5-6 zum Tragen kommt und das Ergebnis ist optimal. Der Weg dahin ist wirklich sehr interessant, wie bist Du nur darauf gekommen? Hast Du darüber mal einen "Artikel" geschrieben, was Du warum wie gemacht hast? So was müsste man eigentlich veröffentlichen, das Problem werden sicherlich auch andere haben. CU Frank-Andre
__________________
Credendo Vides |
Sponsored Links |
|
|||
Im Moment ist im IE dein Inhaltsbereich noch um 30px zu breit. (Ich hatte das Padding von #col_right entfernt und zum Margin addiert.) Bei den IE-Angaben noch padding:0 für #col_right dazunehmen.
Bisher habe ich nichts darüber geschrieben, es liegen nur ein paar Testcases bei mir rum. Vielleicht ändere ich das mal. Ich habe aufgegegen, das verstehen zu wollen -- und stelle einfach nur fest, dass es bestimmte Konstellationen gibt, die im IE stabil bleiben. Wenn du in diesem Beispiel den breiten Border des #content durch ein Padding ersetzt, bricht's wieder um. Ein Margin hingegen funktioniert. |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
CSS Problem - Finde den Fehler nicht... | expou | CSS | 4 | 27.04.2011 13:31 |
Layout Problem mit float | tr67 | CSS | 7 | 21.10.2008 20:03 |
So langsam bekomme ich die Krise mit den DIVs | Thuroc | CSS | 12 | 12.11.2007 15:25 |
Problem mit float | CSSNoobie | CSS | 2 | 07.05.2006 01:10 |
Zeilenumbruch bei horizontal nebeneinanderliegenden divs | GrafZahl | Knowledge Base | 10 | 16.07.2004 17:13 |