Horizontal scroll overflow HTML <li> without knowing the width

Question

http://jsfiddle.net/waitinforatrain/DSSPb/2/

I want to organize a group of elements <li>that represent images in a horizontal scrollable container, as in the example above.

The tricks I've seen so far define the width of the container as the width of the elements <li>. However, I do not know what the width of the container will be, because the content is dynamic.

Is there a way to do this with CSS without knowing the width of the container?

Answer 1

Something like this, maybe? http://jsfiddle.net/mattball/5JRdZ/

• ul li display inline-block
• li { float: left; }
• ul { white-space: nowrap; }, <li> , <ul>

li { height: 100%; margin: 4px }, <li> , <ul>. ( : http://jsfiddle.net/mattball/avTgR/:)