He estado atascado en este problema durante horas.
Este es mi Header.js
<div className="navbar-inner"> <h2>Text1</h2> <h3>Text2</h3> </div> Este es mi archivo Header.css :
.navbar-inner { margin: 0 auto; color: #fff; display: flex; width: 87vw; background-color: red; justify-content: space-between; vertical-align: sub; }Esto es lo que se muestra:
Me gustaría que Text1 y Text2 estén alineados en la misma línea y: 
Puede dar flex en la etiqueta h2 y h3.
h2, h3 { display: flex; align-items: center; }align-items es lo que necesita para alinear verticalmente el texto cuando usa el cuadro flexible.
También eliminé el margen de los elementos h2 y h3 (está ahí por defecto).
.navbar-inner { margin: 0 auto; color: #fff; display: flex; width: 87vw; background-color: red; justify-content: space-between; /* New styles */ align-items: flex-end; padding: 5px; } h2, h3 { margin: 0; }Probablemente necesitará ajustar el relleno para alinearlo como realmente lo desea en términos de qué tan cerca debe estar el texto de los bordes.