How to make a DIV stretch?

Code:

<div style="background-color:#cccccc; width:200px;"> <p>Test</p> <p>HereIsAReallyLongWordThatShouldMakeTheDivExpand</p> </div>

How can I make the div stretch to accommodate "HereIsAReallyLongWordThatShouldMakeTheDivExpand"
???

change width:200px to min-width:200px
perhaps.
Perhaps, because you have given a totally isolated snippet of code, and teh rest of the page could affect things.

remove the width, or try width: 100% or width:auto;

The default behavior of a DIV is to take up 100% of its parent's width. What you could (in theory) do is set the width of the parent to 200px, then force the paragraph's overflow to "auto", but I can't tell you if it would work without testing it.

Doesn't min-width not work in IE 6?

I need the width to be at least some defined px.

If overflow is set to auto...wont it show a scrollbar?
EDIT: It does show a scroll :-(
EDIT: It works in IE 7 but shows a scroll in FF.

No, it doesn't, but there are ways around it.

Hello

Float, always fits

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>12345 12345 12345 12345 12345</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  <style type="text/css"> *{padding:0;margin:0;} .x,.z{ background:#cccccc; float:left; } .w{min-width:200px; } .cl{clear:both;} .y{overflow:auto;}/* always fit IE 7 FF OP NS */ * html .y{float:left;} * html .y p{height:1%;}/* always fit IE 5 5.5 6 */ * html .w{width:200px;} * html .z{left:3px;position:relative;margin:0 0 0 -3px;}/* 3 pixel jog wrap */ </style> <style type="text/css"> * html .fc{height:1%;} /* IE 5 5.5 6 haslayout */ *:first-child+html .fc{zoom:1;} /* IE 7 haslayout */ </style> <script type="text/javascript"> </script> </head> <body> <p class="cl">always fits, stretch</p> <div class="x w"> <p>Test</p> <p>HereIsAReallyLongWordThatShouldMakeTheDivExpand</p> </div> <div class="y"> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> </div> <p class="cl">wrap, strech</p> <div class="z w"> <p>Test</p> <p>HereIsAReallyLongWordThatShouldMakeTheDivExpand</p> </div> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> <p class="cl">always fits, (min) width</p> <div class="x w"> <p>Test</p> <p>Test</p> </div> <div class="y"> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> </div> <p class="cl">wrap, (min) width</p> <div class="z w"> <p>Test</p> <p>Test</p> </div> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> <p class="cl">always fits, content width</p> <div class="x"> <p>Test</p> <p>HereIsAReal</p> </div> <div class="y"> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> </div> <p class="cl">wrap, content width</p> <div class="z"> <p>Test</p> <p>HereIsAReallyLongWord</p> </div> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> <p class="cl"> </p> <p class="cl">always fits, no width, no content</p> <div class="x"> </div> <div class="y"> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> </div> <p class="cl">wrap, no width, no content</p> <div class="z"> </div> <p>Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text Test Text </p> <p class="cl"> </p> </body> </html>