[Vuejs]-Rectangular Trapezoid using CSS – remove extra space

1👍

remove the height and change the 41% to 100%

button {
  width: 100%;
  height: 50px;
  font-size: 20px;
  background-color: red;
  text-transform: uppercase;
  border: none;
  font-weight: 500;
}

.trapezoid {
  width: 220px;
  clip-path: polygon(0 0, 100% 0, 84% 100%, 16% 100%);
}
<div class="trapezoid">
  <button :form="form" :type="props.type">text</button>
</div>

Leave a comment