Css 按钮的灵活宽度

我使用下面的CSS作为我的按钮

 .ui-button-text {
background-color:#3e9cbf !important;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #F0F8FF !important;
width: 50px;
}

这里，如果您愿意检查，我使用的是

width:50px但我希望按钮的宽度灵活，它应该根据文本大小改变宽度如果按钮文本是
提交
，那么按钮宽度将变小，但是如果文本是这样的
发布您的问题
现在按钮宽度应该改变。
我们如何通过css实现这一点？
这样做：

CSS:

html:

如果使用div，则需要将其设置为
display:inline block
，然后不需要设置宽度

演示

没有得到你的男人：）诉讼快乐的社会，这就是问题所在！：-）@David SkyMesh的问题是按钮width@JavaProgrammer事实上你做到了@JavaProgrammer让我们回到上下文，检查下面的答案..这就是您需要的吗？虽然您使用了
，但实现起来非常简单！重要信息
在您的示例中。这也适用于
width:auto以及此元素中的其他样式，我必须添加宽度的问题：自动！重要的；
.ui-button-text {
background-color:#3e9cbf !important;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #F0F8FF !important;
    padding:2px 6px;
}

<button class="ui-button-text">Submit</button>
<button class="ui-button-text">Post your question</button>

.ui-button-text {
background-color:#3e9cbf !important;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #F0F8FF !important;
    width:50px;
}

button.ui-button-text{
    width:auto;
    padding:2px 6px;
}

.ui-button-text {
    background-color:#3e9cbf !important;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #F0F8FF !important;
    padding: 10px;
    display:inline-block;
    width: auto !important; 
}