php - 带有 2 行文本的按钮比带有 1 行文本的按钮大，但我需要它们都与 1 行的大小相同

Question

我网站上的按钮是根据文本的多少来调整大小的。当有 2 行时，按钮比 1 行的按钮大。我该如何解决这个问题？

这在某一点上是固定的，但又坏了。这当然不是它的全部代码，

.wp-block-column {
  margin-bottom: 0;

  @include desktop {
    height: 138px;
    height: 252px;
    flex-basis: auto;
    font-size: 30px;
    line-height: 36px;
    width: 357px;
    height: 238px;
  }
}

.wp-block-button {
  height: 100%;
}

.wp-block-button__link {
  display: flex;
  justify-content: center;
  align-items: center;
}

.wp-block-columns {
  justify-content: center;
}

.all-button {
  border-radius: 1rem;

  text-transform: uppercase;
  text-align: center;
  font-family: 'Lato-Bold';
  text-decoration: none;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;

  &:hover {
    opacity: 0.5;
  }

  @include desktop {
    width: 355px;
    margin: 0;
    font-size: 1.67rem;
    margin: $base__space-unit;

    border-radius: 8px;

    a {
      font-size: 30px;
      height: 100%;
      width: 100%;
      #text {
        margin: auto;
      }
    }
  }
}

我希望所有按钮的大小都相同

Answer 1

给他们准确的高度 Ex.

.all-button {
  height: 42px; //Put here size you want
}

或者给 white-space: nowrap;