Da baue ich für einen Kunden ein Design zusammen. Nix weltbewegendes, das ist nicht mein Ding.

Alles funktioniert - zunächst auf einer Seite.

Ok, ein paar Standardseiten mit Inhalten aus der Datenbank mit dazu.

Und was passiert: Das flackert wie verrückt, das ganze Design rutscht nach links, wenn man zwischen den Seiten hin- und herklickt. Im IE geht es einigermaßen, im FF ist es grausam. Ok, der Kunde nutzt meistens den IE, aber das kann es ja nicht sein.

Einsicht nach zehn Minuten (!) Suchen: Die Startseite und eine andere Seite hatten noch wenig Text, also paßten die von der Höhe her rein. Die anderen Seiten hatten mehr Text, also kam die Scrollleiste dazu - und der Content rutschte natürlich nach links, weil die Scrollleiste Platz braucht.

Muß man eben die Seite per height:105% so vergrößern, daß schon in der Normalansicht Scrollleisten sichtbar sind. Dann verschwindet das Problem - größtenteils.

Edit: Und das flackerte immer noch leicht - warum klappte das auf einer anderen Seite?

Da findet sich die Lösung, auch, warum die Browser so unterschiedlich reagieren: Der Rahmencode enthielt eine Blindtabelle per 'width:100%', das wird nach innen vererbt. Bettet man den inneren Teil auch in eine Blindtabelle ein und fixiert die, dann flackert nichts mehr. Denn das unterbricht die Vererbung.

Hallo!

Ich kenne mal davon aus, dass da keine konkrete Frage dahintersteckt und poste mal ein ähnliches Problem, dass aber einen anderen Lösungsansatz beinhaltet... Vielleicht gibt Dir das ein paar Ideen (Sicher nicht, da ich JS nehme).

Ich habe ein Navigations-Div links. Statisch Breit 200 pixel. Links davon das Content-Div, welches ich dann über die ganze Bildschirmbreite ziehen wollte.

Also habe ich "min-width: 700px;" definiert. Und halt die absoluten Positionen für das Content-Div.

Das Resultat:
IE zieht Content auf die vollen 100% des restlichen Bildschirms auf
Opera: macht das nur, wenn sich innerhalb von Content noch eine Tabelle mit 100% befindet. Ansonsten wird halt je nach Text oder Bilder entweder min-width: 700px genommen oder was grösseres...
FF 2.0: zieht Content auf die vollen 100% des restlichen Bildschirms auf.

Dann kam das Update auf FF 3.0... Mist... FF 3.0 verhält sich nun wie Opera...

Meine Lösung ist nun:
Weiterhin min-width: 700px Aber zusätzlich noch folgendes JS:

width=document.body.offsetWidth-210;
document.writeln ("<style type='text/css'>#content {width: "+width+"px}</style>");

Wer nicht mit JS surft, der hat halt eine Seite, die sich ab und zu seltsam verhält. Ich kann damit leben.

Nun das Irre:
ich habe ja min-width 700px definiert und nachfolgend kommt ein normales width:
IE: beachtet dann min-width nicht mehr...
FF und Opera: beachten min-width im Fall dass der Wert für width kleiner wird.

Die Lösung macht aber keine Probleme mit Scrollbalken. document.body.offsetWidth funktioniert mit gewissen Sicherheitsreserven in allen Browsern...

Glaub mir: ich habe den Einsatz einer Blindtabelle auch erwogen...
Insofern sind wir schon relativ nahe mit den Problemen...

Für mich war die Sache neu, daß der Rahmenwert 'width:100%' einer umgebenden Tabelle auf innere Tabellen vererbt wird, so daß deren Spaltenbreiten in Abhängigkeit von der Größe des Inhalts verschiedenartig ausfallen.

Und das, obwohl diese Spalten eigentlich in der Breite fixiert waren.

Grob skizziert:

Die Termine rechts sehen immer gleich aus. Der Hauptcontent variiert. Und immer verschoben sich die aktuellen Termine etwas. Nicht viel, nur Millimeter - aber eben sichtbar. Stopft man (eigentlich ist das nämlich eine völlig sinnfreie Logik) den Hauptcontent in eine Blindtabelle, die per width:500px festgenagelt wird, dann flackert das nicht mehr.

Und das Problem trat sowohl im IE7 als auch im FF.3 auf. Theoretisch wäre es noch denkbar (da Rahmenelemente mit dabei waren), daß mir beim Zusammenrechnen irgendein Fehler passiert ist, so daß es einen Widerspruch zwischen der außen vorhandenen Breite (= 100%) und der Summe der inneren Elemente gegeben hätte.

Tabellen haben schon immer ihre Probleme ...
Oder geht´s doch um CSS?
Kann das mit dem box modell bug zusammenhängen (google bringt 393000 Ergebnisse)?
Problem:
Die verschiedenen Browser stellen Elemente unterschiedlich groß dar, wenn ihnen per CSS Werte für Breite (width), Höhe (height), Innenanbstand (padding) und Rahmen (border-width) zugewiesen werden.
Korrekte doctype wirkt da manchmal Wunder.