jQuery UI Bouton avec débordement

Question

J'ai deux conteneurs imbriqués, chacun avec une hauteur et un débordement spécifiés. Cela fonctionne généralement comme prévu, sauf lorsque mon conteneur interne contient des boutons d'interface utilisateur jQuery. Lorsque c'est le cas, il "semble" correct, mais le conteneur externe continue de défiler, comme si le contenu était visible, même si le conteneur interne le cache.

Voir cette jsFiddle pour une démonstration de la question:
http://jsfiddle.net/bnT2r/1/

Quelqu'un at-il vu cela avant, ou peut trouver une solution à ce problème?

MISE À JOUR:
Cela ne semble être un problème dans Chrome. Testé dans FF et IE8, et il apparaît comme prévu.

TIA,
-J

Answer 1

Essayez de changer les propriétés de trop-plein et la position du #outer div:

position:relative; 
overflow:hidden; 

jsFiddle example.

Answer 2

La définition de la hauteur de la case à cocher 0px semble résoudre le problème. Cela semble un peu bizarre, mais comme il est caché par jQuery UI, c'est acceptable pour l'instant.

input[type=checkbox].ui-helper-hidden-accessible { 
    height: 0; 
}