title: HTML/CSS Lining up divs
body: <p>This is pretty basic CSS question. I have this as my result:</p>
  
  <p><a href="https://i.stack.imgur.com/Gy9hm.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Gy9hm.jpg" alt="enter image description here"></a></p>
  
  <p>I want the name and date to be on a single line next to the menu icon</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="topnav"&gt;
      &lt;span style="font-size:30px;cursor:pointer;" onclick="openNav()"&gt;&amp;#9776;&lt;/span&gt;
      &lt;div class="topline"&gt;
          &lt;div id="name"&gt;John Doe&lt;/div&gt;
          &lt;div id="date"&gt;04/27/2018&lt;/div&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.topnav{
      background-color: #3071a9;
      color: #ffffff;
  }
  .topline{
      padding-left: 20px;
  }
  
  #name {
      float:left;
  }
  
  #date {
      float:left;
  } 
  </code></pre>