JSFiddle - React, Tailwind, and code Playground

HTML

<div class="Element">
    <div class="HeadingL">Choose size</div>
    <div class="click1">
    <ul>
      <li><a href="#">10cm $175</a></li>
      <li><a href="#">15cm $295</a></li>
      <li><a href="#">20cm $395</a></li>
    </ul>
    </div>
    </div>

CSS

.click1 ul {
 padding: 0;
 list-style-position: inside;
 list-style-type: none;
}
.click1 li {

 display:inline-block;  
 padding: 5px;
 margin-right:5px;
 border-color:green;
 border-style: solid;
 border-width: 1px;
 border-radius: 5px;
 white-space: nowrap;
margin-bottom: 40px;
}

.click1 li:hover {

 border-color:red;

}

.Element {
 border-bottom: 1px solid #000;
  width:100%
}
.HeadingL {
 padding-top:10px;
 text-transform: uppercase;
 font-family: 'Open Sans', sans-serif;
}