Align H1 Header and Normal Text in Same Line

Original answer (still working just fine)

See the snippet below. The idea is to make the <h1> inline to allow the second text to be at the same line.

header { border-bottom: 1px solid #000; }
header > h1 { display: inline-block; }
header span { margin-left: 100px; }

<header>
  <h1>Text</h1>
  <span>text2</span>
</header>

2020 Update

See the snippet the snippet below that makes use of Flexbox. So instead of setting the h1 to an inline-block, you can make the header a flex container. A flex container will (by default) layout its children on a horizontal axis.

Note that you also need align-items: center to keep the h1 and span on the same vertical axis. Also, note that you might want align-items: baseline if you want the texts to appear on the same baseline (like my original answer).

header {
  display: flex;
  align-items: center;
  
  /* Remove the next line if you want the span to appear next to the h1 */
  justify-content: space-between;
  
  border-bottom: 1px solid #000;
  padding: 10px 30px;
}

<header>
  <h1>Text</h1>
  <span>at the end</span>
</header>