title: Correct HTML5 mark-up for floating logo, slogan and 2 navs
body: <p>I'm having difficulty understanding the recommended method for using sections, navs, headers and floating div containers in unison.</p>
  
  <p>I have a network-wide nav followed by a site-wide nav, just like this Stack Overflow website.</p>
  
  <p>Based on the following code...</p>
  
  <pre><code>&lt;header&gt;
  
      &lt;!--Navigation menu for network:--&gt;
      &lt;section&gt;
          &lt;nav&gt;
              &lt;a href="#"&gt;Link&lt;/a&gt;
              &lt;a href="#"&gt;Link&lt;/a&gt;
              &lt;a href="#"&gt;Link&lt;/a&gt;
          &lt;/nav&gt;
      &lt;/section&gt;
  
      &lt;!--Navigation menu for site:--&gt;
      &lt;section&gt;
          &lt;div class="float-left"&gt;
              &lt;h1&gt;Logo Text&lt;/h1&gt;
              &lt;h2&gt;Slogan Text&lt;/h2&gt;
          &lt;/div&gt;
          &lt;nav class="float-right"&gt;
              &lt;a href="#"&gt;Link&lt;/a&gt;
              &lt;a href="#"&gt;Link&lt;/a&gt;
              &lt;a href="#"&gt;Link&lt;/a&gt;
          &lt;/nav&gt;
      &lt;/section&gt;
  
  &lt;/header&gt;
  </code></pre>
  
  <ol>
  <li>...should I have both navs in their own sections within the one header as is or should I have two headers?</li>
  <li>...should my div.float-left be a section within a section?</li>
  <li>...overall, is there a better way to arrange my mark-up?</li>
  </ol>