<div class="parent">
  <div class="row">
    <div class="column">
      <span>Name:</span>
    </div>
    <div class="column">
      <input type="text">
    </div>
    <div class="column"></div>
  </div>
  <div class="row">
    <div class="column">
      <span>Surname:</span>
    </div>
    <div class="column">
      <input type="text">
    </div>
    <div class="column">
      <input type="text">
    </div>
  </div>
</div>

* {
  box-sizing: border-box;
}

.parent {
  width: 400px;
  padding: 10px;
  border: 1px dashed red;
  margin: -5px;
}

.row {
  display: flex;
  justify-content: center;
}

.column {
  margin: 5px;
}

.column:nth-child(1) {
   flex: 0 0 60px;
}

.column:nth-child(2)) {
  flex: 1;
}

.column:nth-child(3) {
  flex: 0 0 40px;
}

input {
  width: 100%;
}