Css 如何在jquery ui按钮中居中显示ui图标

我正在寻找一种使用jquery ui创建工具栏按钮的方法

我尝试使用

<div id='menubar_home' style='vertical-align: middle;width: 20px; height: 20px;'>
</div>

但按钮中的图像未居中：

---

如何在按钮中居中显示图像？

我假设图像中没有透明面

将边框添加到

img

以进行定位：

边框：1px纯红

然后检查图像是否有
显示：块属性

尝试添加
边距：0自动属性，用于将块（图像）居中

您可能需要添加
！重要信息
强制属性：
边距：0自动！重要的

希望能帮助你（不确定，如果不亲自操作代码就不容易）。
添加一个
填充：8px编码到按钮/输入样式，以允许图标正确对齐。
您也可以在div中放置一个span，如下所示：

#menubar_home {
    display:table-cell;
    vertical-align: middle;
    text-align: center;
}

<div id="menu-bar-home">
    <span class="ui-icon ui-icon-home"></span>
</div>

div#menu-bar-home {
    position:relative;
}
div#menu-bar-home > span {
    position: absolute;
    left: +or-(n)px; /* so just adjust the position
}

还请注意，您可能需要调整跨度的z索引

祝你好运，兄弟

编辑：您仍然可以通过这种方式获得所需的结果，但我认为您是在使用div创建按钮。
正如下面这位先生所建议的，我会将菜单栏的css设置为：

div#menu-bar-home
{
display: table-cell;
vertical-align: middle;
text-align:center;
}

我最终在CSS中做了以下工作：

#menubar_home {
   font-size: 0; 
   width: 23px; top: 5; 
   height: 23px;
}

#menubar_home {
   font-size: 0; 
   width: 23px; top: 5; 
   height: 23px;
}