从html按钮溢出的文本似乎与应用的样式相反

我就是不明白为什么这个按钮中的文本没有换行到下一行。相反，它在最后被切断了。以下是样式：

#find-attach-all-content-container input[type="button"] {
    width: 60px;
    height: 60px;
    background-color: #fd902a;
    color: #fff;
    padding: 5px;
    position: absolute;
    left: -10px;
    top: -20px;
    font-size: 14px;
    line-height: 15px;
    overflow: visible;
    text-align: center;
    border: solid #b6b6b6 1px;
}

以下是html：

<input type="button" class="attach-btn" value="Attach to Response" onclick="postConditionFindCure( <?php echo get_the_ID() ?> );">

您应该添加：

white-space: normal;

空白
的默认值设置为输入元素不换行。
您可以使用回车符换行：

溢出：仅当容器元素没有定义静态高度时，可见的
将处理文本

此外，您还需要覆盖默认值
空白
，将其设置为
正常
，否则文本将在其容器元素的末尾换行

因此，您需要通过删除
高度
并设置
空白
来更改样式：

#find-attach-all-content-container input[type="button"] {
    width: 60px;
    /* height: 60px; */
    background-color: #fd902a;
    color: #fff;
    padding: 5px;
    position: absolute;
    left: -10px;
    top: -20px;
    font-size: 14px;
    line-height: 15px;
    overflow: visible;
    text-align: center;
    border: solid #b6b6b6 1px;
    /* Added */
    white-space: normal;
}



我应该补充一点：正常也没有帮助。请阅读我的答案，它会起作用：）有趣，我一直认为，这是不可能的！它之所以有效，是因为您删除了
高度
。否则，它不会：我会谨慎地使用这个…：|@Melancia：我没有去掉高度，它起作用了。。。也许这取决于浏览者的不同。我在用Chrome，我也在用Chrome。检查我发布的JSFIDLE链接。它包含您发布的原始样式+此答案中的规则。如果您保持
高度
规则，就不可能达到您想要的效果。高度取决于您打断文本的行数。不是建设性的。网站的目的是提供一个问题的正确答案，尊重OP的建议，除非它是完全错误的。他们的代码在样式中提到了
高度
，所以你的答案不起作用。@Jay只是为了澄清MelanciaUK的观点，你的解决方案将使用默认样式，但不使用OP提供的样式。@MadScienceDreams你是在告诉我，有时候人们发布css时，不需要更改就可以修复吗？我同意他把身高定为60，但老实说，这里的人增加了风格，我们用我们的答案来改变他们，如果我们让每个人的css保持原样，那么我们就无法解决这个问题。这不对吗？我接受了我的反对票，但是这个答案仍然是一个选择，我相信MelanciaUK一直很挑剔，这不是挑剔。差不多是这样。那就把你的答案填好。请注意，要使此解决方案起作用，OP需要更改样式。这就是全部。
#find-attach-all-content-container input[type="button"] {
    width: 60px;
    /* height: 60px; */
    background-color: #fd902a;
    color: #fff;
    padding: 5px;
    position: absolute;
    left: -10px;
    top: -20px;
    font-size: 14px;
    line-height: 15px;
    overflow: visible;
    text-align: center;
    border: solid #b6b6b6 1px;
    /* Added */
    white-space: normal;
}