Row Of Fluid Images?

[mboehler3]

Hi all, I'm working with fluid images for the first time at the request of a client. The design of the webpage has a row of three images, expanding a total of roughly 1180 pixels. Take a look here:http://acq.matthewboehler.com/test.phpI'm using fluid images because I want to make it so that, if the browser is shrunk below 1180 pixels wide, the row of images stays intact, and the images simply shrink.Right now, when you shrink the browser, the images fall onto another line. Shrink it far enough and you have three images stacked on top of each other.Is it possible through CSS to keep these images on the same line? I've even tried putting the images in a table, but it still pushes them onto a new line.Any help is very much appreciated, thank you!

[dsonesuk]

divide 100 by number of images to give you percentage as in 33%, then try it.

[mboehler3]

Thank you, that works for me. Each column has a different width, so instead of making each column 33%, I made it relative to the container size. The middle column is the widest, and the left column is the narrowest. Now, is it possible to get everything centered on the page, like "margin-left:auto;margin-right:auto" works? I tried that and it did not work. By default everything is left aligned. I even tried putting everything in a table and that did not work.

[mboehler3]

Actually this may be more than I asked for. I didn't think about when the browser is scaled down. Ideally no matter how far down the browser shrinks, I'd like to have 10% of dead space on the left and right of the screen.

[mboehler3]

Alright, nevermind, solved it using margin-right:10%;margin-left:10%.