JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
<li class="required">
  <input type="text">
</li>
<li class="grid required">
  <p>one</p>
  <p>two</p>
  <p>three</p>
</li>
<li class="required">
  <input type="text">
</li>
</ul>

CSS

html {width: 75%;}
ul {list-style: none;}
input {width:100%}
.grid {display: grid; grid-template-columns: .33fr .33fr .33fr;}
li.required::before {content: '*'; float:right; font-size: 15px;}