JSFiddle - React, Tailwind, and code Playground

HTML

<div class="section-header">General Properties</div>
<div id="policy-parameters">
  <div class="parameter-row">
    <label for="inputPolicyName" class="">Name</label>
    <div class="parameter-entry">
      <input type="text" class="" id="inputPolicyName">
    </div>
  </div>
  <div class="parameter-row">
    <label for="inputPolicyDescription" class="">Description</label>
    <div class="parameter-entry">
      <input type="text" class="" id="inputPolicyDescription">
    </div>
  </div>
  <div class="parameter-row">
    <label for="inputPolicyDescription" class="">A 3rd Row</label>
    <div class="parameter-entry">
      <input type="text" class="" id="inputPolicyDescription">
    </div>
  </div></div>

CSS

#policy-parameters {
  border: 1px solid #6c6c6c;
  display: table;
  width: 100%; 
}

#policy-parameters .parameter-row {
    display: table-row; 
}
    
#policy-parameters .parameter-row label {
      background-color: #deddd9;
      border-right: 1px solid #c4c2be;
      display: table-cell;
      padding: 5px 3px 5px 7px;
      width: 175px; }

#policy-parameters .parameter-row .parameter-entry {
      background-color: #f7f6f5;
      display: table-cell;
      padding: 5px; 
}
#policy-parameters .parameter-row .parameter-entry input[type="text"] {
        width: 400px; 
}

#policy-parameters .parameter-row:not(:last-child) > * {
      border-bottom: 1px solid #c4c2be; 
}