CSS 自动换行不适用于 <a> 标签

Question

我正在使用Word-wrap:brakword标签：a。如果溢出width:100px;

tag:a 的样子：

如何标记：a 应该是：

我的代码看起来像：

div{
    width: 50px;
}
.GreenBtn {
    background-color: #6aae12;
    border: 1px solid #539102 !important;
    color: #FFFFFF !important;
    cursor: pointer !important;
}
.buttonGreen {
    font-family: 'Roboto';
    border: 1px #ddd solid;
    background: #6AAE12;
    color: #FFF;
    /* margin-bottom: 10px; */
    padding: 7px 12px;
    transition: color 300ms ease-in-out 0s, background-color 300ms ease-in-out 0s, background-position 300ms ease-in-out 0s;
}

<div >
  <a class="GreenBtn buttonGreen" style="text-decoration: none;" href="#">
    <span> Bestellung anzeigen </span>
  </a>
</div>

Answer 1

正如Vitorino fernandes在评论中所说，display:block在.GreenBtn. 它按预期工作。

.GreenBtn {
        background-color: #6aae12;
        border: 1px solid #539102 !important;
        display:block
        color: #FFFFFF !important;
        cursor: pointer !important;
    }