<form>
  <fieldset>
    <legend>Your Name</legend>
    <div>
      <label for="first">First Name</label>
      <input type="text" id="first" placeholder="Jane">
    </div>
    <div>
      <label for="last">Last Name</label>
      <input type="text" id="last" placeholder="Smith">
    </div>
  </fieldset>
</form>
body {
  padding: 3rem;
}

legend {
  font-size: 1.15rem;
  font-weight: 700;
  padding: 1rem;
}

div {
  margin-bottom: 1rem;
}

input {
  border: 1px solid #000;
  height: 20px;
  padding: 3px 5px;
}

input::placeholder {
  color: rgba(0, 0, 0, 0.5);
}

input:empty {
  background: tomato;
  border-color: #b71c1c;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.