title: Twitter and Facebook buttons alignment
body: <h1>Context</h1>
  <p>I want to display Twitter and Facebook buttons on my new site.</p>
  <p>But I get an issue with alignment.</p>
  <p><img src="https://i.stack.imgur.com/0sDGS.png" alt="enter image description here" /></p>
  <h1>Code</h1>
  <p><strong><a href="/questions/tagged/html" class="post-tag" title="show questions tagged &#39;html&#39;" rel="tag">html</a>:</strong></p>
  <pre><code>&lt;span id=&quot;social&quot;&gt;
      &lt;a href=&quot;https://twitter.com/share&quot; class=&quot;twitter-share-button&quot; data-via=&quot;guillaumgregoir&quot;&gt;Tweet&lt;/a&gt;
      &lt;div class=&quot;fb-like&quot; data-href=&quot;http://csstooltip.com&quot; data-send=&quot;false&quot; data-layout=&quot;button_count&quot; data-width=&quot;450&quot; data-show-faces=&quot;false&quot;&gt;&lt;/div&gt;
  &lt;/span&gt;
  </code></pre>
  <p><strong><a href="/questions/tagged/css" class="post-tag" title="show questions tagged &#39;css&#39;" rel="tag">css</a>:</strong></p>
  <pre><code>#social {
      display: inline-block;
      margin-left: 24px;
  }
  
  div.fb-like {
      display: inline-block !important;
      margin-left: 100px;
      margin-top: -20px;
  }
  </code></pre>