如何将 2 个按钮与一个具有 2 条线的按钮对齐

Question

我想对齐 2 个具有不同对齐数的按钮。垂直和水平对齐它们的最佳方式是什么？

.button-kyc {
  height: 70px;
  padding: 15px 25px;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  background-color: #2F5597;
  border: none;
  border-radius: 15px;
}

<p style="text-align:center;">
  <button class="button-kyc">
    Line1<br>
    Line2
  </button>
  <button class="button-kyc"> Line1 </button>
</p>

Answer 1

将 vertical-align: top; 添加到您的按钮 class。

.button-kyc {
  height: 70px;
  padding: 15px 25px;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  background-color: #2F5597;
  border: none;
  border-radius: 15px;
  vertical-align: top;
}

<p style="text-align:center;">
  <button class="button-kyc">
    Line1<br>
    Line2
  </button>
  <button class="button-kyc"> Line1 </button>
</p>

如何将 2 个按钮与一个具有 2 条线的按钮对齐

How to align 2 buttons with one button having 2 lines

css

button

alignment