I have a div in which I am placing several images, and by default they wrap so that each one appears below the one before it and they flow vertically downward. What I am wanting to do is to have them NOT wrap, and instead flow horizontally rightward.
I've tried floating all images to the left, and turning off whitespace wrapping, but this doesn't seem to do anything:
<div style="float: left; white-space: nowrap"> <img src="alpha.png"> <img src="bravo.png"> </div>
The only solution I've come across that works is to give the div a specific width:
<div style="6500px;"> <img src="alpha.png"> <img src="bravo.png"> </div>
However, I don't reliably know how wide all the given images will be (or indeed how many images there will be). These will be large images (a photo gallery) and they should extend off the side of the page so that the user can then horizontally scroll through them all. Is there a reliable css way to do this?