Question

I want to use min-width and width for a class. Is that possible?

Can I use the following code :

.container
{

min-width:1000px;
width:100%;
height:100%;
overflow:hidden;
}

Thanks

Answer 1

Using min-width and width on a single selector is fine, it’s often the basis for most fluid layouts.

However, IE6 lacks support for the min-width property; instead, it interprets the “width” property as min-width, and will expand in width as wide as the non-breaking content it contains requires. But judging from your code, this won’t help you because any content wider than 1000px is most likely to have breaks in it (spaces between words, etc.).

If you want this to work in IE6, you’ll likely need to incorporate a javascript solution. Something along the lines of:

if(element.scrollWidth < 999) {
  element.style.width = 1000;
} else {
  element.style.width = "100%";
}

Note: My code is not simply a copy/paste solution, but rather a starting point for you to flesh out and apply to your specific need.