title: fixed header within material-ui LeftNav
body: <p>I was trying to create a fixed header (in this case, a Toolbar) within a LeftNav so that when the LeftNav scrolls, the Toolbar stays in its position. But somehow applying <code>postion: 'fixed'</code> to the Toolbar doesn't seem to work within LeftNav. When the content within the LeftNav is more than window height, the whole LeftNav, including the top Toolbar with <code>fixed</code> position, scrolls. Have anyone figured out how to create a fixed position element within a LeftNav? </p>
  
  <p>Here is the code for reference:</p>
  
  <pre><code>...
  const toolBarStyle = {
    position: 'fixed',
    top: 0,
  };
  return (
    &lt;LeftNav
      open={open}
      docked={false}
      onRequestChange={onRequestChange}
    &gt;
      &lt;Toolbar style={toolBarStyle}&gt; /&gt;
      {this.props.children} // children could be a lot of content
    &lt;/LeftNav&gt;
  );
  ...
  </code></pre>