垂直按钮组。如何使所有按钮均一尺寸？

Question

请问如何在垂直按钮组中将按钮制作成一种尺寸（最小的按钮与最大的按钮具有相同的尺寸）？所有按钮的大小均取决于内部文本。

<div class="container body">
                    <div class="btn-group-vertical" role="group" aria-label="Basic example">
                        <a href="{% url "boats:boats"   %}"><button type="button" class="btn btn-secondary">Back</button></a>
                        <a href="{% url "boats:boat_edit" current_boat.pk %}"> <button type="button" class="btn btn-secondary">Edit</button></a>
                        <a href="{% url "boats:boat_delete" current_boat.pk %}"><button type="button" class="btn btn-secondary">Delete</button></a>
</div>
</div>

Answer 1

指定锚标记和按钮标记的宽度。

.btn-group-vertical a, .btn-group-vertical button {
  width: 100%;
}

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

<div class="container body">
  <div class="btn-group-vertical" role="group" aria-label="Basic example">
    <a href=""><button type="button" class="btn btn-secondary">Back</button></a>
    <a href=""> <button type="button" class="btn btn-secondary">Edit</button></a>
    <a href=""><button type="button" class="btn btn-secondary">Delete</button></a>
  </div>
</div>