Overflow: hidden in firefox 3.6

Question

I made a form script so that I can always use that if I need a form, but I noticed that when I set for a field the property on overflow hidden it still is visible in Firefox (tested in 3.6).

I saw that still more than 5% of the users look in FF 3.6 so I need to fix it.
I googled it for it but all the fixes they said didn't help me with my bug...

Link to jsFiddle I made a part on the form in JS fiddle, if you can test in chrome, IE 6+ and then FF 3.6 you see the differences (when you click on the checkbox the hidden content should show).

Please can someone help,

Sander

can you tell us what should we test in different browser, please explain your problem properly so that we help you in the problem, rather than wasting our time in finding the problem. — Murtaza, Jan 13 '12 at 10:10
but i noticed that when i set for a field the property on overflow hidden it still is visible in FF ( i tested in 3.6 ). — Rednas, Jan 13 '12 at 10:26
Why aren't you just using `display:none` rather than hiding overflow? — My Head Hurts, Jan 13 '12 at 11:00
You should still be able to get the slide effect with `display: none;` — My Head Hurts, Jan 13 '12 at 14:37

score 4 · Accepted Answer · answered Jan 13 '12 at 15:07

It looks like it is a Mozilla bug that has been going on for over 7 years (reported 2004-09-22):

https://bugzilla.mozilla.org/show_bug.cgi?id=261037

The problem

overflow is always treated as overflow: visible on a fieldset when it is assigned a fixed height or width (no matter what you set it as).

The Workaround

You could either use display: none to hide the fieldset content or if you want to carry on using the overflow:hidden approach then you could either change the element from fieldset to div or nest fieldset within another div with the property overflow: hidden.

Nested fieldset example: http://jsfiddle.net/8nbuj/8/

Overflow: hidden in firefox 3.6

1 Answers1