JSFiddle - React, Tailwind, and code Playground

HTML

<header>
  <nav>
    <article>
      <a href="#">
        <h3>
        VanillaJs</h3>
        <span>cookbook!</span>
      </a>
    </article>
    <ul class="left calendar">
      <li><a href="#">Booking Calender</a></li>
    </ul>
  </nav>
</header>

CSS

nav {
  width: 100%;
  height: 150px;
}

article,
ul {
  float: left;
}

ul li {
  list-style-type: none;
}

.calendar {
  margin-top: 24px;
}