IE6 and Overflow

Stop IE6 from resizing block to fit content

[Captaffy]

Is there a way to stop IE6 from resizing a containing block to the size of the content when the text size is increased? I would prefer the content was not clipped as with overflow: hidden, but rather appeared outside the containing block.

Failing that, is there a way I could specify overflow: hidden ONLY for IE6?

[penders]

Are you limiting the size of the container in CSS? If you are using em's or ex's then the dimensions will naturally increase as the font-size increases.

If you are limiting the size in px (a fixed dimension) for instance, then according to the W3C spec you should be able to use overflow:visible to do what you require. This should limit the size of the container to what you have defined in your CSS, but allow the contents to spill out (visible). HOWEVER, this does not work in IE6 (ok, in IE7 Strict and all other browsers).

To specify overflow:hidden for IE6 only then consider using conditional comments [webmasterworld.com] to include an 'IE6 Only' stylesheet. Such as:

<!--[if IE 6]> 
<link rel="stylesheet" type="text/css" href="ie6only.css"> 
<![endif]-->

[Captaffy]

Thanks Penders. That is EXACTLY what I had ended up doing. It's a shame overflow: visible doesn't work like it should in IE6. Good riddance when it's gone in four more years :P

[BritishAgent]

Thanks for this. I was looking for the same answer.

[penders]

You're both welcome. Just to add, regarding

overflow:visible

, IE6 will expand the container to make the contents fit. So yes, it is visible, but the container is not restricted as it should be - the contents no longer overflows; it is contained!