CSS flotte avec des largeurs inconnues ne pas envelopper les espaces avec doctype

Question

Deux divs, flottaient à gauche, d'une largeur inconnue. L'un d'eux a plus de contenu que correspond à la page, il se déplace en dessous du premier (sauf dans IE):

http://corexii.com/floatproblem/float.html

Ajouter display: inline table; et le grand enveloppe son contenu (toujours dans les navigateurs):

http://corexii.com/floatproblem/table.html

Mais introduire un type de document (pas seulement stricte, TOUT doctype) et ne plus dans Firefox:

http://corexii.com/floatproblem/doctype.html

Comment puis-je obtenir le droit div pour envelopper son contenu tout en utilisant un type de document en même temps, de manière fiable entre les différents navigateurs?

Answer 1

  

Comment puis-je obtenir le droit div pour envelopper son   le contenu en utilisant un type de document à la   En même temps, de manière fiable entre les différents navigateurs?

Sans définir la largeur, vous ne pouvez pas . Je vous recommande de largeurs de pourcentage dans ce cas, mais il est à vous.

La largeur par défaut pour un div est de 100% de son conteneur (dans ce cas, la page). La première div finira par sa taille réelle à moins que vous redimensionnez la page pour être plus petite que sa largeur inhérente. La cohérence des navigateurs accross attendant sans doctype complète et valide est tout simplement un exercice futile.

Answer 2

CSS ne peut pas tout à fait faire tout ce que des mises en page de table peut. D'une part, mises en page dynamiques de largeur sont beaucoup plus compliquées. Tableau-moins mises en page sont toujours préférables pour 98% des cas, mais si vous avez vraiment besoin de ce genre de mise en page de largeur dynamique vous pourriez avoir à utiliser une table.

largeurs Incohérence, sinon bien proportionné, ne sont pas très bon d'un point de vue esthétique que vous pouvez être fixer le mauvais problème.

Answer 3

Vous pourriez commencer par incluant un élément BODY.

Traingamer vous a donné une explication du comportement de Firefox et ce qui doit être fait pour obtenir le résultat souhaité. Vous pouvez l'écouter au lieu d'aller sur une tangente à propos de CSS étant impossible de créer des mises en page avec.

Ne pas blâmer CSS pour les problèmes que vous introduisons en ne respectant pas les spécifications corriger web.