CSS schwebt mit unbekannten Breiten wickeln nicht Leerzeichen mit Doctype
Frage
Zwei divs schwebten links, unbekannter Breite. Einer von ihnen hat mehr Inhalt als die Seite paßt, so bewegt er sich unter dem ersten (außer in IE):
http://corexii.com/floatproblem/float.html
In display: inline-table; und die großen wickelt seinen Inhalt (konsequent in allen Browsern):
http://corexii.com/floatproblem/table.html
Aber Einführung einer Doctype (nicht nur streng, ANY Doctype) und es nicht mehr in Firefox:
http://corexii.com/floatproblem/doctype.html
Wie erhalte ich die richtige div seinen Inhalt zu wickeln, während ein Doctype gleichzeitig verwenden, zuverlässig in allen Browsern?
Lösung
Wie erhalte ich die richtige div seine wickeln Inhalt, während ein Doctype die Verwendung von Gleichzeitig zuverlässig in allen Browsern?
Ohne Breiten definiert, Sie können nicht . Ich würde Prozentsatz Breite in diesem Fall empfehlen, aber es ist bis zu Ihnen.
Die Standardbreite für einen div ist 100% seines Behälters (in diesem Fall der Seite). Der erste div endet es die tatsächliche Größe, es sei denn Sie die Seitengröße kleiner sein, dass seine inhärente Breite. Erwartet Konsistenz accross Browser ohne eine vollständige und gültige Doctype ist einfach eine Übung in Sinnlosigkeit.
Andere Tipps
CSS kann nicht ganz tun alles, was Tabelle basierte Layouts können. Zum einen sind dynamische Breite Layouts viel komplizierter. Tabelle lose Layouts sind immer noch bevorzugt, 98% der Fälle, aber wenn Sie wirklich diese Art von dynamischer Breite Layout benötigen Sie eine Tabelle verwenden.
inkonsistente Breiten, wenn sie nicht sorgfältig proportionierte, sind nicht sehr gut von einem ästhetischen Standpunkt, so dass Sie sein kann, das falsche Problem beheben.
Sie, indem ein BODY
Element beginnen könnten.
Traingamer hat man eine Erklärung für Firefox Verhalten gegeben und was getan werden muss, um das gewünschte Ergebnis zu erhalten. Sie könnten auf ihn hören, anstatt auf einer Tangente abgehend über CSS unmöglich sein zu erstellen Layouts mit.
nicht die Schuld CSS für Probleme, die Sie sind die Einführung von nicht Web-Spezifikationen zu korrigieren haften.