no word-wrapping!?

[ReMaX]

Am I too tired?
I want to make a horizontally scrolling image gallery like it is used sometimes in myspace.com. I just started writing the css code but it doesn't work. It has to scroll horizontally and not vertically!


a, img {
margin:0;
padding:0;
border:none;
display:inline;
float:left; }
#gallery {
position:absolute;
margin:20px 0 0 0;
width:99%;
height:500px;
border:1px solid #000;
overflow:auto;
background:#bbb; }
#gallery #scrollbox {
height:500px; }
#gallery #images {
heigth:500px;
border:1px solid green; }
...
<div id="gallery">
<div id="scrollbox">
<div id="images">
[images generated by PHP]
</div>
</div>
</div>

Anybody an idea? Please help.

greetings
MAX

[ReMaX]

no answers?!
Help!
*push*

[ReMaX]

Hey, this is serious. It doesn't work and I need help. That cannot be that difficult. I only want to have no word-wrapping in a div so that one image is next to the other in one line. Scrolling, Clicking, Dragging will then be done with Javascript.
HELP!!!

[jscheuer1]

Many of the considerations here are interdependent.

One can use the deprecated <nobr></nobr> tag around content that you don't want to have wrap:


<div><nobr>
non-wrapping content goes here
</nobr>
</div>

But some folks don't want to use deprecated tags, and some browsers may not follow it. You can set the style of the division, using the white-space style property (http://www.eskimo.com/~bloo/indexdot/css/properties/text/whitespace.htm) set to nowrap (style should be set in the stylesheet section, shown here inline):


<div style="white-space:nowrap;"><nobr>
non-wrapping content goes here
</nobr>
</div>

I left the nobr tags in to support older browsers. You can fairly safely take them out. If you do, test in your target browsers.

If you have any elements (div, p, or br, for example) that cause line breaks located inside the division though, there will still be line breaks.

Now, all of this assumes that images are display inline. That is their default display property. But, if this is changed anywhere for the images that are in this division, it still won't work. Only worry about this last bit if you are still having problems.