Min-Width & Max-Width Are Not Working In FF...

inVINCEable · 06-01-2007, 04:10 AM

I have a three column page setup. I keep running into the problem when I re-size my browser horizontally, the words will run into eachother from column one, which is the navigation, into column two, which is the content area.

The third column is fine in that it is just an image advertisement and it does not resize.

The problem is that the first column will run into the second column only when it gets very small. I tried using the min-width and max-width css properties but they did not work.

For the sizing I have the <div> container that contains my whole page set to 100%. Then I have column one which is floated to the left set to 12%, then column three which is floated to the right set to 18%, then I have the middle column's margins set margin-left:13% and margin-right:20%

What can I do so the boxes automatically stop at a certain point instead of keep minimizing? I would like the content to resize somewhat, but stop after a certain point.

Here is an example of what I want to happen, NZBMatrix . com

^When you resize that, the columns eventually stop instead of continuing to minimize.

Thanks for any input.

vanilladesign · 06-01-2007, 05:19 AM

Do you have a link to the page? In the min heights are you using em/px or % measurements?

inVINCEable · 06-01-2007, 02:04 PM

Quote:

Originally Posted by vanilladesign

Do you have a link to the page? In the min heights are you using em/px or % measurements?

In the min heights I am using % measurements.

I am sorry I do not have a link to the page, is there any way I can recieve help or must I find a way to link to the page?

koyama · 06-01-2007, 10:35 PM

Quote:

Originally Posted by inVINCEable

What can I do so the boxes automatically stop at a certain point instead of keep minimizing? I would like the content to resize somewhat, but stop after a certain point.

Set up a min-width for your container. At least it should work in Firefox and IE7. If you cannot get it working then post your complete code.

Quote:

Originally Posted by inVINCEable

Here is an example of what I want to happen, NZBMatrix . com

That page is using tables. In a table layout you will never see overlap between columns.