HTML Pictures Horizontial Row

I was wondering if there was a开发者_开发问答 way to make a div containing images have an overflow that scrolls horizontially, as depicted in the projected diagram below:

alt text http://www.zip-cover.com/development/image_carosoul/slideshow.jpg

as always, any help is greatly appreciated

---

Something like this should work:

#imageContainer { 
  height: 200px;
  overflow: auto; 
  white-space: nowrap; 
}

Make sure the images aren't higher than the height parameter.

---

You need to know the width and amount of images inside the div to prevent it from wrapping:

<div id="outer">
    <div id="inner" style="width: 3200px;">
        <img src="1.jpg" />
        <img src="2.jpg" />
        <img src="3.jpg" />
        <img src="4.jpg" />
    </div>
</div>

And in CSS:

#outer {
    overflow: hidden;
    width: 800px;
    height: 600px;
}

#inner {
    height: 600px;
}

This example assumes your images are 800x600px, adjust as necessary.

---

Try just

overflow-x: auto;