Valid <nobr> alternative?

[teitunge]

Hi.I'm building a site for a photographer. Instead of using frames to put pictures out, I am using a css-box with custom js-scrollbars. The problem is getting all the pictures on one horizontal line. I can achieve this by using the <nobr> which both IE and FF understands, but as soon as I try using the css-nowrap alternative, I am no longer able to scroll. CSS FOR THE BOX:

#gallery{	width: 70%;	border: dotted 1px #312b27;	height: 510px;	position: fixed;	top: 260px;	left: 12%;	overflow: auto;	background-color: #48413b;}

HTML

<div id='gallery' class='flexcroll'><nobr><img src='gfx/music/1/1.jpg' alt='' /><img src='gfx/music/1/2.jpg' alt='' /></div>

Any hint, answer or direction to a tutorial would be very much appreciated.Thanks in advance.

[jeffman]

First, get rid of <nobr>. It's legacy markup at best, won't validate, and could lose support in the next version of any browser without warning.Maybe if you posted a link and/or explained a little more what effect you want and what you're actually getting. For starters, "all the pictures on one horizontal line" could mean aligned at the top or the bottom, and that will mean a different solution.Are the images guaranteed to be the same size or at least the same height?You could define a class for your images and play around with the position property and maybe the top or bottom coordinate, even the left coordinate if you knew in advance how wide these guys are. While you're there, you could give your images some margins so they don't bumptogether. I wonder what float:left might accomplish, if anything.Just throwing out some stuff.

[teitunge]

First, get rid of <nobr>. It's legacy markup at best, won't validate, and could lose support in the next version of any browser without warning.Maybe if you posted a link and/or explained a little more what effect you want and what you're actually getting. For starters, "all the pictures on one horizontal line" could mean aligned at the top or the bottom, and that will mean a different solution.Are the images guaranteed to be the same size or at least the same height?You could define a class for your images and play around with the position property and maybe the top or bottom coordinate, even the left coordinate if you knew in advance how wide these guys are. While you're there, you could give your images some margins so they don't bumptogether. I wonder what float:left might accomplish, if anything.Just throwing out some stuff.

Thanks for responding so quickly. I have not published anything yet, since I am waiting for the webhotel to kick in, but I could try to explain a little better.The pictures is 500px high, just as the <div> i created. When I add photos in the <div> with the <img>-tag they only get posted vertically without the <nobr>-tag. You had some good suggestions there, and I will dive into the floating to check if that could take me any further.Thanks again :-)

[remrow]

You mean showing your content as the next, next?? You would like to use AJAX for them! The <nobr>, as Deirdre' Dad said is now old.