Question

Here is your dumb HTML/CSS question for the day….

I have a div that contains two other divs. The container is set to display: box/-webkit-box/etc to stack the contained divs horizontally. The first contained div is some fixed content, and the second contains a bunch of other little tile divs.

Here’s a sample: http://jsfiddle.net/dex3703/T2EZy/3/

Also a cheesy diagram (please note the 1000px shown is only an example — there is no width set on any of the div containers):

My problem is the second contained div takes the width of the parent, so it’s always stretching outside the browser. I want the two divs to be contained inside the container. Everything needs to be dynamic so when the browser resizes the content adjusts correctly. I can’t put a fixed size on the container or the second div.

Answer 1

If you are not required to use display: box, try using the older float method: http://jsfiddle.net/gpdV3/