¿Cómo puedo alinear su altura de borde automáticamente este 2 fieldset usando css? - css3

¿Cómo puedo alinear su altura de borde automáticamente este campo de campo 2 usando css?

  /*Fieldset and Legend*/
.the-legend {
font-size: .9vw;
font-weight: 600;
line-height: 10px;
width:auto;
padding:0 10px;
border-bottom:none;
}

.the-fieldset {
border: 1px solid silver;
border-radius: 5px;
padding: 20px;
margin-bottom: 15px;
}

los pls me ayudan aqui y gracias

ACTUALIZAR

Sobre el código a la estructura de mi código. Divido mi fieldset por fila.

Respuestas

Puede ponerlos en un contenedor para padres como una mesa o div, y hacer que los dos niños estén en

 altura = 100%.

Puede usar la visualización tabular (no relacionada con la estructura tabular - HTML - que es la manera de ir con datos tabulares y la forma de NO ir de otra manera).
Las celdas no tienen la propiedad de ser de la misma altura (y se mantienen en la misma línea / fila lo que sea que intentes)

Cuando publicó su código como una imagen, un ejemplo mínimo (compatibilidad IE8 +):

.col-lg-12 {
display: table;
table-layout: fixed; /* the other tabular algorithm */
width: 100%;
}
.col-lg-6 {
display: table-cell;
width: 50%
}
/* Managing gutter between fieldset. No margin, only padding, on cells so we use inner elements */
.col-lg-6:first-child .the-fieldset {
margin-right: 2rem;
}
.col-lg-6:last-child .the-fieldset {
margin-left: 2rem;
}

EDITAR: .col-lg-6 tendrá la misma altura pero aún no fieldset (agregar outline: 1px dotted someColor a ambos y lo verás). Por lo tanto, debes agregar height: 100% a ambos contenedores (celdas), el elemento con un borde (fieldset) y todos los elementos intermedios (ninguno aquí). O elimine el borde de fieldset y agréguelo a .col-lg-6; no cambia la semántica ni la accesibilidad y tiene el mismo resultado visual

EDIT2: Flexbox Es otra forma de gestionar las alturas verticales con bastante facilidad. La compatibilidad es IE10 + (y fácil de lograr y mantener si usa Autoprefixer, de lo contrario meh)