So you can see I have the img element set to "max-width: 100%;" so it will resize appropriately when its container shrinks. However, the images only resize when the browser window width is smaller than the image width. This actually isn't even working on the latest version of Firefox for some reason... but it's working in Chrome so it would be nice if someone could explain why that is too.

Anyway, I want it so that once the window size is resized small enough, the #wrapper will start shrinking. Instead of dropping the images into one column, I want them to start shrinking relative to the window size. How can this be done?