ExtJS rendering buttons

1
votes

I have two buttons in ExtJS and I use float to position them nicely, and one of them looks broken, meaning like 10% of the button from right side is not showing, but when I click the combobox in same form, the button seems to adjust and render properly.

Basically its a form with one combobox and 2 buttons, submit button floats left, refresh button floats right, the refresh button is 10% floated into the border, and its cut from right side, and when combobox is clicked and value is chosen the button comes to its original position, this only happens in IE, I don't know what I should do about this bug, any help would be appreciated, thanks!

1
extjscomboboxrendering
Could you provide some sample code? html, css, and js would be helpful. In what versions of IE does this occur? - Bryan
IE 8 I'll add code as answer for format - Grigor
This might be because when you click a combobox a new css is added to the combo box properties, which might be overriding some of the custom css you must've applied for the floating effect and hence fixing the problem. What happens when you close the combo? does it go back to the right? - Varun Achar

1 Answers

1
votes

I bet this is due to padding assigned to one or both of the buttons. In IE, when padding is applied to a floating object, IE doubles the padding. Use margin instead of padding and see if that fixes everything.