Formatting images and descriptions

[Durbs]

I'm querying a database for image information (ie the image path, image title, image description) and want to display then together, how is the best way?

All images are 200px wide so i would like them displayed in rows with the accompanying title underneath (using as many lines as required but each line being no longer than the 200px width of the image, if that makes sense), until the end of the container is hit and then continue on the next line, so to speak.

I thought of being naughty and using a table but due to different screen resoultions you can never predict how many would be on a row. Any thoughts??

Rich

[ryanbutler]

You can't predict how many will be on a row using a table, how's that? If you display three images in a table row, then you'll only get three images in that row. I'd approach it with a table personally. And then style the image description inside the able.

[Durbs]

Sorry, what i meant was that as the size of the container is set by the width of the window you are view the page in you won't be able to predict how many images will fit on a row. Does that make sense? So in other words if you adjust the size of the browser window the images would change rows to suit ( ie in a wide window you may get 6 in a row and then you make the window narrow and only 2 would fit).

Also, i'd quite like them centred, so if there is only one image it would be in the centre of the container. I had a simlar query about centring buttons and someone suggested margin: 0 auto; yet this didn't seem to do much.

Rich

[Durbs]

I've also tried using something like:

echo '<div class="box"><a class="link" href="http://www.mywebsite.com/'.$image_path.'"><img class="image" src="'.$thumb_path.'" alt="'.$image_title.'" /></a><br />'.$image_title.'</div>';

But <div>'s stack on top of each other, not next to each other. Is there a way to <div>'s (or something more suitable) sit side by side on a 'row'?

[The Old Sarge]

Have you tried floating the <div>s?

[Durbs]

I have indeed but that causes the container where they 'sit' to shrink to much smaller than the images and i loose the formatting.

Rich

[Durbs]

Help anyone?