title: Twitter & Facebook Share Buttons Misaligned
body: <p>I added a facebook and twitter share button to the bottom of each of my posts, but the two buttons are misaligned by about 3px and I can't figure out how to make them align with each other.</p>
  
  <p>I tried adding a negative margin to the Facebook widget and also tried adding a positive one to the Twitter widget. The browser ignores it both times (even if I used !important).</p>
  
  <p>You can see the issue here: <a href="http://cantstopshipping.com" rel="nofollow">http://cantstopshipping.com</a></p>
  
  <p>Does anyone know how to fix this issue?</p>
  
  <p>Here's my code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!--FACEBOOK SCRIPT--&gt;
      &lt;div id="fb-root"&gt;&lt;/div&gt;
      &lt;script&gt;(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&amp;appId=258039414242053&amp;version=v2.0";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));&lt;/script&gt;
      &lt;!--/ FACEBOOK SCRIPT--&gt;
      &lt;!--TWITTER SCRIPT--&gt;
      &lt;script&gt;!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");&lt;/script&gt;
      &lt;!--/ TWITTER SCRIPT--&gt;
  
  &lt;div class="sharepost"&gt;
        &lt;a href="https://twitter.com/share" class="twitter-share-button" data-url="&lt;?php the_permalink() ?&gt;" data-text="&lt;?php the_title(); ?&gt;" data-via="CantStopShippin" data-hashtags="&lt;?php $category = get_the_category(); echo $category[0]-&gt;cat_name; ?&gt;" data-count="vertical"&gt;Tweet&lt;/a&gt;
        &lt;div class="fb-share-button" data-href="&lt;?php the_permalink() ?&gt;" data-type="box_count"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And here is the CSS I tried to add to fix the issue:</p>
  
  <pre><code>.fb-share-button {
      margin-top: -2px !important;
  }
  </code></pre>
  
  <p>Also, the CSS of .sharepost (which the chare buttons are inside) is:</p>
  
  <pre><code>.sharepost {
  width: 325px;
  height: 65px;
  float: right;
  text-align: center;
  margin-top: 3px;
  }
  </code></pre>