JSFiddle - React, Tailwind, and code Playground

HTML

<div id="one">
  <p>
    <label for="a">a</label> <input type="text" id="a">
  </p>
  <p class="h">
    <label for="b">bbbbbb</label> <input type="text" id="b">
  </p>
</div>

<div id="original-one">
  <p>
    <label for="a">a</label> <input type="text" id="a">
  </p>
  <p>
    <label for="b">bbbbbb</label> <input type="text" id="b">
  </p>
</div>

<div id="two"></div>

CSS

#one {
  background: red;
  display: table;
}

#original-one {
  background: green;
  display: table;
}

p {
  display: table-row;
}

p label, p input {
  display: table-cell;
}

.h {
  visibility: hidden;
  height: 0;
  line-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: block !important;
}

#two {
  background: blue;
  height: 1em;
}