Extjs / Javascript: How to put images vertically - aligned with other fields (textboxes,combos) in a multiple line panel with hbox layout? -

how can arrange images in panel 'hbox' layout , in same time, keep them aligned other fields in form ? common form fields in extjs have margin-bottom of 5px , height of 22px, way can think right put image considering field defaults. problem comes when have multiple lines in panel, in internet explorer especially.

basically, want form this:

what tried far (first created image directly, not item in container --> same result):

createimageitem: function(config) {     return ext.create('ext.container.container', { width: 16, height: 22,             items: [{ xtype: 'image', padding: 3, src: 'resources/images/arrowleft.png'}],             margin: '0 5 5 5'      }); } 

in chrome looks fine, in ie images go 1px every row. don't know why.

is there other way this? perfect nicer way , don't bother pixels , calculations.

thank you!

i using extjs version 4.0.7

you use ext.isie property set dimensions based on browser, example:

margin: ext.isie ? '0 5 6 5' : '0 5 5 5' //or whatever appropriate values 

you'll still have worry counting pixels, @ least same in both browsers.