View Full Version : min-width not working...how I expect at least.

08-24-2010, 03:53 PM
Hi, I've a page with lots of div's (no tables! Yea!)
But in the center main div (ID'ed #content) I have an image 600px wide. If the browser window is made narrow enough, it pops the image way down below the encroaching side div's.
I thought using min-width on that image's div would prevent the browser from narrowing the contents that far, but it doesn't seem to be working.
Is that not how min-width works? Is there something else I need to do to keep the browser from narrowing the contents too much?
Thanks for any suggestion.

08-24-2010, 04:02 PM
Have you tried setting you image width to percentages as well? I notice you use a combination or pixels and percentages to style elements. The pixel widths for any element dont allow for in different page widths. A pixel in a 800 x 600 resolution browser is much larger than one in a 1200 x 900 browser. Just a thought.

08-24-2010, 04:16 PM
Have you tried setting you image width to percentages as well?
Hmm, I hadn't thought of that.
That's a great idea for some other image possibilities, but not that main center image! Having that one stretch big doesn't work! It's HTML dimensions are set exactly to the image's actual width/height.
I'll keep that suggestion in mind for other possibilities, though. Thanks!

In any case, doesn't help with the image popping below the side divs (I tried). :)

08-24-2010, 06:02 PM
Well that is whats causing the image to "pop" below the right div. When the right div encroaches into the set width of the image, the image MUST go somewhere. It cant go over top of the div so it shifts underneath it. Again, if you design the page with a wide screen resolution, then view it on a low resolution, it will cause issues everytime. I know! I'm having s silimar issue at the moment. Still, try to set the image to percents that mimic the original dimensions. Also, you can try to designing your page with an elastic design. Then your page will just "disappear" as it shrinks. I think you can google elastic page layout and find some good info/tutorials.