кнопки с 2 строками текста больше, чем кнопки с 1 строкой текста, но мне нужно, чтобы все они были того же размера, что и 1 строка - PullRequest
0 голосов
/ 18 февраля 2019

размер кнопок на моем сайте зависит от количества текста.когда есть 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;
      }
    }
  }
}

Я ожидаю, что все кнопки будут одинакового размера

Ответы [ 2 ]

0 голосов
/ 18 февраля 2019

Дайте им точную высоту

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

или Даешь white-space: nowrap;

0 голосов
/ 18 февраля 2019

Вы можете попробовать это:

.all-button {
    width: 150px; 
    //or whatever fits your theme
    height: 50px;
    //or whatever fits your theme
}

Добавив указанный выше код, вы дадите точную высоту и ширину своей кнопке.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...