JSFiddle - React, Tailwind, and code Playground

by rae0724

HTML

<a class="btn" href="javascript:void(0)"><div class="txtt">button</div></a>

CSS

.btn {
    font-size: 16px;
    width: auto;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    padding: 4px 20px;
    border: none;
    color: #fff;
    -o-text-overflow: clip;
    text-overflow: clip;
    background: #000;
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    text-align: center;
    display: inline-block;
}

.txtt {
  -webkit-transform: skewX(20deg);
  transform: skewX(20deg);
}