Javascript 如何在ExtJS GridPanel的列中居中放置图像？

我想水平居中列“数据”中的图标：

我的专栏上有文本对齐：居中：

在图标渲染器函数中，我使用CSS将其水平居中：

但它仍然是左对齐的

---

我还需要做什么才能使列中的图标水平居中？

这有点像猜测，因为我没有任何东西要测试

我注意到

margin:0 auto

无法将图像居中

---

这让我想到，您需要在图像上显示

display:block

，这样您的

margin

规则就可以满足您的期望。

也许您需要像这样更改渲染功能：

function renderDataIcon(val) {
    if(val=='online') {
        return '<div style="width:100%;height:16px;background-image:url(/images/icon_yellow_dot.png);background-position:center center;background-repeat:no-repeat;">&nbsp;</div>';
    } else {
        return '<div style="width:100%;height:16px;background-image:url(/images/icon_red_dot.png);background-position:center center;background-repeat:no-repeat;">&nbsp;</div>';
    }
}

函数renderDataIcon（val）{
如果（val==‘在线’）{
返回“”；
}否则{
返回“”；
}
}

将align:'center'添加到actioncolumn项中实现了以下目的：

{
xtype:'actioncolumn'，
文本：“编辑”，
对齐：'居中'，
项目：[{**}]
}

您能给我完整的renderDataIcon功能吗？