html ボタンの配置について

Question

html/css　を使って、ボタンを作成したのですが、縦一列に配置するため、ボタンがくっついてしまっているので、改行したいです。

試した事

 <div id="title" class="btn-square">
    <a href="floor03.html" class="mb1">一階</a><br>
    <a href="floor04.html" class="mb1">二階</a><br>
    <a href="floor05.html" class="mb1">三階</a><br>
    <a href="floor06.html" class="mb1">四階</a><br>
    </div>

	.btn-square {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  background-color: rgba(46, 111, 54, 0.65);
  color: #FFF;
  border-bottom: solid 4px #627295;
  border-radius: 3px;
}
.btn-square:active {
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  border-bottom: none;
}

.mb1{
    margin-bottom: 5em;
}

Answer 1

.mb1{display:block;}