[2.2] IE and FF Checkbox alignment problems

[KRavEN]

1. In IE7 the checkbox's end up centered instead of left aligned like they are in firefox.
2. If firefox the checkbox is rendered a few pixels lower than it should be but IE7 is correct.

Fixes:
1. in Checkbox.js change the getResizeEl to check for IE and Safari

getResizeEl : function(){
if(!this.resizeEl){
this.resizeEl = Ext.isSafari||Ext.isIE ? this.wrap : (this.wrap.up('.x-form-element', 5) || this.wrap);
}
return this.resizeEl;
}

2. Fix to make FF and IE7 look identical add css

.x-form-check {
margin-bottom: 4px;
}

.x-form-check-wrap-inner {
display: inline;
padding: 0;
}

[sanraj]

Thank you very much Kraven,
It works great..

[chrizmaster]

mhm,

i have trouble with this bug but also I can'T find the checkbox.js in my ext folder.

Could anyone explain, where I have to put this fix in? Also where I have to put the css fix in.

Thank u all
Chriz

[Condor]

Isn't this problem also solved by my Checkbox/radio cumulative bugfix (http://extjs.com/forum/showthread.php?t=44603)?

[shivaaqua]

Use the following code

Ext.override(Ext.form.Checkbox, {
getResizeEl : function(){
if(!this.resizeEl){
this.resizeEl = Ext.isSafari||Ext.isIE ? this.wrap : (this.wrap.up('.x-form-element', 5) || this.wrap);
}
return this.resizeEl;
}
});


it should work




mhm,

i have trouble with this bug but also I can'T find the checkbox.js in my ext folder.

Could anyone explain, where I have to put this fix in? Also where I have to put the css fix in.

Thank u all
Chriz

[Roy Paterson]

You can see this problem in the Ext examples.

Load this link in IE:

http://extjs.com/deploy/dev/examples/menu/menus.html

Click on the "Button w/Menu".

Note that page declares as "Strict", and so it looks OK at first. But if you switch IE to "quirks mode" then you see the problem. Unfortunately we're using quirks mode...