更改按钮宽度以适合文本宽度

Question

我有一个带有一些文字的按钮，按钮的文字太长，所以它会自动换行到下一行。由于我有一个固定的按钮高度，按钮中的第二行文本被隐藏，因为溢出未设置为可见。

example

有没有办法设置按钮来改变它的宽度，并使其与内部文本一样长？

我目前的css：

.block .btn {
    background-color: #464646;
    color: #fff;
    border:none;
    height: 30px;
    font-family: 'Segoe UI';
    font-size: 16px;
    cursor: pointer;
}
.block .btn:hover{
    background-color: rgba(40, 40, 40, 255)
}

编辑：

发现我的问题：在样式中设置了宽度设置的剩余样式=＆＃34;＆＃34; HTML中实际按钮的属性。 CSS本身没有任何问题。无论如何，谢谢你的答案！

Answer 1

如果没有提供更多的CSS或HTML，有点难以说明......但这可能是由于空白包装，尝试在按钮上设置white-space到nowrap

e.g。

button{
  white-space:nowrap;
}

per MDN

  

white-space CSS属性用于描述空白的方式   处理元素内部。

Answer 2

您正在修复按钮的height。如果文字需要更高的高度，请尝试使用min-height。