Une div à l'intérieur d'une autre div prend incorrectement la largeur de la div parente

Question

Voici votre question bête HTML/CSS pour la journée....

J'ai une division qui contient deux autres divisions. Le conteneur est réglé sur display : box/-webkit-box/etc pour empiler les divs contenues horizontalement. La première div contenue est un contenu fixe, et la seconde contient un tas d'autres petites divs en forme de tuiles.

En voici un exemple : http://jsfiddle.net/dex3703/T2EZy/3/

Egalement un diagramme de mauvais goût (veuillez noter le Les 1000px montrés ne sont qu'un exemple -- il n'y a pas de largeur définie sur aucun des conteneurs div) :

Le problème est que le deuxième div contenu prend la largeur du parent, ce qui fait qu'il s'étend toujours en dehors du navigateur. Je veux que les deux divs soient contenues dans le conteneur. Tout doit être dynamique pour que le contenu s'adapte correctement lorsque le navigateur est redimensionné. Je ne peux pas imposer une taille fixe au conteneur ou à la deuxième division.

Answer 1

Si vous n'êtes pas obligé d'utiliser display : box, essayez d'utiliser l'ancienne méthode float : http://jsfiddle.net/gpdV3/

Answer 2

Si vous connaissez le parent avec dans PX pas dans 100% .

disons que comme vous avez mis dans votre capture d'écran "1000px" votre css va fonctionner

ex :

cliquez ici

Answer 3

Comme vous connaissez la taille des parents et des enfants, c'est très facile. http://jsfiddle.net/rTL6T/

Answer 4

C'est parce que vous imposez par code la largeur de votre div (quelque chose comme .MyClass{width:1000px}).

Veuillez jeter un coup d'œil à cette réponse :

Comment faire en sorte que la largeur CSS remplisse le parent ?