How To Expand A Div To Its Content Width WHEN It Is Larger Than Its Parent?

I'm trying to build a carousel view. For that I have a parent div, representing the viewport, a content div, holding the items to be shown in the view, and an unknown number of div

Solution 1:

You can use display: inline-block; on the #content-div

Solution 2:

Using min-width instead of width on the viewport div should do the trick. This allows the content div to expand to the full children width.

#viewport {
   position: absolute;
   min-width: 400px;
   height: 200px;

http://jsfiddle.net/j4LnB/1/