Как сделать так, чтобы текст внутри button был без наклона?

Question

[Юрий]

Есть такая кнопка с наклоном. Можно ли сделать так, чтобы текст внутри кнопки был без наклона?

button
    border: 1px solid #ffffff
    padding-left: 40px
    padding-right: 40px
    padding-top: 10px
    padding-bottom: 10px
    background: none
    font-size: 18px
    color: rgb(255, 255, 255)
    text-transform: uppercase
    transform: skewX(-15deg)

Answer 1

[BigSmoke]

<button><span>BUY NOW</span></button>

button{
  border: 1px solid #ffffff;
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
  background: none;
  transform: skewX(-15deg);
}
span {
  transform: skewX(15deg);
  font-size: 18px;
  color: rgb(255, 255, 255);
  text-transform: uppercase;
  display:block;
}

Суть тут в том, что кнопку поворачиваем в одну сторону, а ее содержимое в противоположную.

Comments

[Юрий]

Спасибо

Answer 2

[Дархан]

transform: skewX(15deg) для текста (вроде)