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

我已经有一个按钮，其中包含一些文本，并且该按钮的文本太长，因此它会自动换行到下一行。由于我有固定的按钮高度，因此按钮中的第二行文本是隐藏的，因为溢出未设置为可见。修改按钮宽度以适合文本宽度

有没有一种方法来设置按钮来改变它的宽度，使它只要里面的文字？

我现在的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) 
}

编辑：

发现我的问题：有在风格宽度设定一些吃剩的造型=“”在HTML实际按钮的特性。 CSS本身没有任何问题。无论如何感谢您的答案！

来源

2014-03-28 Sammy Sammon

它一点很难说清楚没有提供更多的CSS或HTML ...但是这可能是由于空白的包装，尽量按钮

例如设置white-space到nowrap

button{ 
    white-space:nowrap; 
}

per MDN

空白CSS属性用于描述如何空白里面的元素进行处理。

来源

2014-03-28 09:51:01 SW4

它成功地阻止了它的包装，但是按钮的宽度并没有增加，所以文本有点就离开了按钮并且到了现在：（ –

由于父容器的限制，这样的声音正在发生。它很难帮助没有HTML/CSS，但看到你找到你的解决方案:) – SW4

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

来源

2014-10-15 16:24:05

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

回答

相关问题