title: angular-material positioning side nav with main content not aligning
body: <p>I'm trying to have a side-nav (fixed left) and a main content area positioned next to each other.</p>
  
  <p>I've tried different combinations of nesting divs and md-content, and switching between/combining row and column layouts. Disregard the inline css and wonky ng code - this is an exercise to test out angular-material.</p>
  
  <p>Here is the html layout.</p>
  
  <pre><code>  &lt;div flex="grow" style="width: 1200px"&gt;
      &lt;md-toolbar class="md-hue-2" style="height: 20px"&gt;
        &lt;div class="md-toolbar-tools"&gt;
          &lt;h2&gt;
            &lt;span&gt;Document List Editing&lt;/span&gt;
          &lt;/h2&gt;
          &lt;span flex=""&gt;&lt;/span&gt;
          &lt;md-button class="md-icon-button" aria-label="Profile"&gt;
            &lt;md-icon md-svg-icon="imgs/ic_perm_identity_white_18px.svg"&gt;&lt;/md-icon&gt;
          &lt;/md-button&gt;
          &lt;md-button class="md-icon-button" aria-label="More"&gt;
            &lt;md-icon md-svg-icon="imgs/ic_more_vert_white_18px.svg"&gt;&lt;/md-icon&gt;
          &lt;/md-button&gt;
        &lt;/div&gt;
      &lt;/md-toolbar&gt;
      &lt;br /&gt;
      &lt;md-sidenav layout="column" class="md-sidenav-left" md-component-id="left" md-is-locked-open="true" md-disable-backdrop="" md-whiteframe="4" style="min-height:500px; max-width: 200px"&gt;
        &lt;md-toolbar&gt;
          &lt;h3 class="md-toolbar-tools"&gt;Site Sections&lt;/h3&gt;
        &lt;/md-toolbar&gt;
        &lt;md-list ng-cloak=""&gt;
          &lt;md-list-item ng-repeat="page in adminClient.sites[0].pages"&gt;
            &lt;a&gt; {{ page.name }} &lt;/a&gt;
            &lt;md-divider&gt;&lt;/md-divider&gt;
          &lt;/md-list-item&gt;
        &lt;/md-list&gt;
      &lt;/md-sidenav&gt;
      &lt;div layout="column" style="max-width: 800px;"&gt;
        &lt;md-toolbar class="md-accent" style="height: 30px;"&gt;
          &lt;h4 class="header-h4"&gt;Documents for site: {{adminClient.sites[0].domain}}&lt;/h4&gt;
        &lt;/md-toolbar&gt;
        &lt;document-list&gt;&lt;/document-list&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>Here's a working plnkr:</p>
  
  <p><a href="http://plnkr.co/edit/ppY0gGVgTLKXxYXiW6eV?p=preview" rel="nofollow">http://plnkr.co/edit/ppY0gGVgTLKXxYXiW6eV?p=preview</a></p>