Style Sheets - Floating Images & Centering

I've been struggling with this one for a while and am at wits end...
it's not a life threatening epic proportions kind of issue, just one
that my type A personality would like to see solved.

I have a changing number of images to be displayed on a page. What I
want is for when there's room, for them to fill up space horizontally
and then flow to the next line. When they *don't* fit (more than one
side by side) I'd like them to center underneath each other. I can do
the filling sideways space (when there's room) with the code show at
the list apart site:

div.container   {       text-align: center;     }

div.float img   {       padding: 10px;
                        float: left;
                        margin: 10px auto;      }

div.spacer      {       clear: both;            }

... and then putting each image in a <div class="float"></div>.

Here's with pix that fit sideways:

http://www.seekwilderness.com/details.php?id=FS1

Here's with some that don't.

http://www.seekwilderness.com/details.php?id=SW1

Any ideas? (let me know if you need more info or code snippets)
                         
~ The U.P. Web Maestro (Nathan Lyle)

  E-Mail: nathan(at)upwebmaestro.com
  Online: www.upwebmaestro.com
   Phone: (906)485-4806

"There are two major products that come out of Berkeley: LSD and UNIX. We don't believe this to be a coincidence." - Jeremy S. Anderson

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA