带有div标签宽度的HTML自动换行设置为百分比

Question

我正在尝试将文本放在HTML / CSS中的按钮下。我希望按钮下方的文本垂直居中。

我已经实现了这一点，但现在文本增加了按钮的宽度。我一直在尝试进行自动换行，但是当你使用百分比来定义div标签的宽度时，它似乎是不可能的。

有没有办法可以使用按钮将文本居中，并在使用宽度百分比时自动换行？

由于

编辑：

按钮定义：

a.button {
     background-clip: padding-box;
     text-decoration: none;
     display: inline-block;
     white-space: nowrap;
     word-wrap: break-word;
     text-align: center;
     text-decoration: none;
     color: black;
     font-weight: bold;
}
a.button span {
     display: inline-block;
     vertical-align: middle;
     margin: 0 0 0 0;
}

这两个部分：

div.blockA {
    width: 35%;
}
div.blockB {
    width: 65%;
}

按钮的图像（在上一篇文章中，我尝试在中间布置四个按钮）：

div.image {
     width: 50%;
     float: left;
     box-sizing: border-box;
     padding: 10px;
}