Как сделать чтобы текст не расползался?

Question

Как сделать чтобы текст не расползался? фиксированная ширина span не помогает Сделать абсолютную позицию тоже, ломается всё

.footer-circle-button{
  background: #329370;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  border-color: transparent;
  transition: 0.3s;
}
.footer-circle-button:hover{
  width: 190px;
  height: 190px;
  transition: 0.2s;
}

<button class="footer-circle-button">              
  <span class="btn_text">
    Ответы на часто задаваемые вопросы
   </span>     
</button>

Answer 1

Используй margin

.footer-circle-button{
  background: #329370;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  border-color: transparent;
  transition: 0.3s;
}
.footer-circle-button:hover{
  width: 190px;
  height: 190px;
  margin-left: -10px;
  margin-top: -10px;
  transition: 0.2s;
}

<button class="footer-circle-button">              
  <span class="btn_text">
    Ответы на часто задаваемые вопросы
   </span>     
</button>

БЛОГ НА HUSL

Как сделать чтобы текст не расползался?

Ответы (1 шт):