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?

War es hilfreich?

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.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top