JSFiddle - React, Tailwind, and code Playground

by SpiceLab

HTML

<div class="social-single">
  <div id="likebutton">
    <div id="fb-root"></div>
    <script>(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/de_DE/sdk.js#xfbml=1&version=v2.8";
    fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
    <div class="fb-like" data-href="http://facebook.com/the.socialnetwork.104" data-layout="button_count"  data-action="like" data-size="large" data-show-faces="true" data-share="true"></div>
  </div>
  <div id="googlebutton">
    <div id="google-root"></div>
    <script src="https://apis.google.com/js/platform.js" async defer>
        {lang: 'de'}
    </script>
    <div class="g-follow" data-annotation="bubble" data-height="24" data-href="//plus.google.com/u/0/118312767548974597051" data-rel="publisher"></div>
  </div>
  <div id="copyscapebutton">
    <div id="copyscape-root"></div>
    <a href="http://www.copyscape.com/"><img src="http://banners.copyscape.com/img/copyscape-banner-white-130x46.png" width="130" height="46" border="0" alt="Protected by Copyscape" title="Protected by Copyscape Plagiarism Checker - Do not copy content from this page." /></a>
  </div>
</div>

CSS

.social-single {
margin: 17px 0 0 30px; 
text-align:center;
}

#likebutton,
#googlebutton {
display:inline-block;
vertical-align:middle
}

#copyscapebutton {
margin-left: 0px;
margin-top: 1px;
}