Question

I’ve style an div that will contain content that might vary in height and width in following way:

div.myDiv {
   display:inline-block;
   *display:inline;/* For IE7*/
   *zoom:1;/* For IE7*/
   white-space:normal;
   vertical-align:top; max-width:280px; overflow:auto; 
}

Intention is to limit expansion of element beyond 280 pixels and let the content grow vertically since I have a overflow: auto on container element. This works fine for all the browsers except IE7. I’m not sure if offset have anything to do with this problem?

Edit: Here is where I’ve setup jsfiddle to demonstrate my scenario but I can’t even view jsfiddle with IE9 (run in IE 7 mode). Hopefully this will help in understanding the problem I’m facing.
Any ideas?

Answer 1

Try setting overflow:hidden:

div.myDiv {
   display:inline-block;
   *display:inline;/* For IE7*/
   *zoom:1;/* For IE7*/
   white-space:normal;
   vertical-align:top; max-width:280px; overflow:auto; 

   /*This line should hide the scrollbar*/

   *overflow:hidden;
}