title: How do I correct fixed positioning for a sidebar in Firefox?
body: <p>I have following HTML in my webpage where I want to keep the sidebar fixed on the left side.It works fine in the Chrome but Firfox isn't displaying the sidebar as fixed :</p>
  <pre><code>&lt;div id=&quot;sidebar&quot;&gt;
      &lt;!-- Logo --&gt;
          &lt;div &gt;
              &lt;h1&gt;Heading&lt;/h1&gt;
          &lt;/div&gt;
              &lt;!-- Nav --&gt;
                  &lt;nav id=&quot;nav&quot;&gt;
                      &lt;ul&gt;
                          &lt;li&gt;&lt;a href=&quot;#target1&quot; &gt;About&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href=&quot;#target2&quot; &gt;Works&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href=&quot;#target3&quot; &gt;Our Team&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href=&quot;#target4&quot; &gt;Contact&lt;/a&gt;&lt;/li&gt;
                      
                      &lt;/ul&gt;
                  &lt;/nav&gt;
                         
  &lt;/div&gt;
  </code></pre>
  <hr />
  <p>the CSS for above code is :</p>
  <hr />
  <pre><code>#sidebar
  {
      position: fixed;
      top: 0;
      padding: 3em 1.35em 1em 1.15em;
      height: 100%;
      width: 12em; 
      background: #364050 ;
      box-shadow: inset -0.1em 0em 0.35em 0em rgba(0,0,0,0.15);
  }
  </code></pre>
  <p>please suggest me some solution so that the sidebar will remain fixed in Firefox.</p>