title: Add margin-bottom to a fixed div
body: <p>There are a few pages to which I would like to add a sticky header dynamically by just placing a script.
  This code adds the header wherever the js is placed. But there should be a margin-bottom to the sticky header, so that there is a separation between the header and content.</p>
  
  <p><a href="http://jsfiddle.net/5gk5vwq7/" rel="nofollow">http://jsfiddle.net/5gk5vwq7/</a></p>
  
  <p>As you can see in the fiddle, the header covers up some of the content.</p>
  
  <p>I cannot change anything in the 'content' css. So,is this possible by modifying anything in js or header css only..</p>
  
  <p>adding margin-bottom to #MarkerTools css did not work</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div id="form"&gt;
      &lt;div id="content"&gt;Lorem ipsum&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>#MarkerTools {
      width: 100%;
      height: 50px;
      position: fixed;
      top: 0;
      background: #2b539a;
  }
  </code></pre>
  
  <p><strong>JS:</strong></p>
  
  <pre><code> $('#form').append('&lt;div id="MarkerTools"&gt;&lt;/div&gt;');
  </code></pre>