0

如何在具有“hbox”布局的面板中排列一些图像，同时保持它们与表单中的其他字段对齐？ExtJs 中的常见表单字段有 a margin-bottomof5px和 a heightof 22px，所以我现在能想到的唯一方法是考虑这个字段的默认值来放置图像。当我的面板中有多行时，问题就出现了，尤其是在 Internet Explorer 中。

基本上，我希望我的表单看起来像这样：

5行面板

到目前为止我尝试过的（首先我直接创建了图像，而不是作为容器中的项目->相同的结果）：

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'
     });
}

在 Chrome 中看起来不错，但在 IE 中，图像会随着1px每一行上升。我不知道为什么。

有没有其他方法可以做到这一点？我会是一个更好的方式，而不是担心像素和计算。

谢谢！

我正在使用 ExtJs 版本 4.0.7

4

1 回答 1

0

您可以使用 Ext.isIE 属性根据浏览器设置尺寸，例如：

margin: Ext.isIE ? '0 5 6 5' : '0 5 5 5' //or whatever the appropriate values are

您仍然需要担心计算像素，但至少它在两种浏览器中看起来都是一样的。

于 2013-08-05T18:07:00.450 回答