div width in css

问题

i have a div on a web page that basically acts as a panel container. i want it to:

1. have a minimum width of 1000px; So no matter how small the content inside the div is, it will at least keep the panel to 1000px in width:
2. in terms of max width, it should keep going as big as the content within it. So if a person has a 24 inch monitor and they want to maximize the browser it should keep growing until the content inside doesn't have any scroll bars and then stop.
3. needs to work in all browsers.

how would i do this in css?

回答1:

Assuming this item is a block element (i.e. "display: block"), it should scale automatically as wide as its containing element (in this case the browser window).

In CSS, just specify "min-width: 1000px." This will work in IE8+ and all modern browsers.

回答2:

try this

#panel {
  min-width: 1000px;
  diplay: block;
  overflow: hidden; }

回答3:

Try this:

#panel
{
   /* Other styles */
   min-width:1000px;
   /*width:100%; - removed as it will create horizontal scrollbar if margin and padding aren't 0 as per Josh's comment.*/
}

However, you will problems with older browsers like IE6 which do not like the min-width thingy in which case you will need to use JavaScript.

来源：https://stackoverflow.com/questions/5490605/div-width-in-css