Javascript jQueryUI图标始终显示在顶部而不是内联

我想用jQueryUI和一些图标来创建一些按钮，以获得更好的风格。我的问题是图标总是显示在按钮文本的顶部。是否有可能显示始终与文本内联的图标

HTML

这里还有一个带代码的JSFIDLE链接，您可以想象我的意思：

---

提前非常感谢

在代码中添加以下内容：

.ui-state-default .ui-icon {
    display: inline-block;
}

选中。

默认情况下，.ui图标类已启用显示：块样式

您需要将其更改为内联块，以使其工作。对于这个示例，我使用了您创建的类左侧的.ui btn图标

.ui-btn-icon-left
{
    display: inline-block;  
    margin: 0;
}

.ui-state-default .ui-icon {
    display: inline-block;
}

.ui-btn-icon-left
{
    display: inline-block;  
    margin: 0;
}