title: List with icons in not fitting to left margin? there is a space
body: <p>html</p>
  
  <pre><code> &lt;ul class="social"&gt;
   &lt;li&gt;&lt;a class="html5" href="#html5"&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a class="twitter" href="#twitter"&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a class="facebook" href="#facebook"&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;ul&gt;
  </code></pre>
  
  <p>Everything works, but not fitted to margin? I need it flush like the rest of my page...any advice?</p>
  
  <p>css</p>
  
  <pre><code>.social ul
  {
  list-style-type:none;
  margin:0;
  padding:0;
  }
  .social li
  {
  display: inline-block;
  }
  </code></pre>