Stevier26
07-21-2016, 05:22 AM
I have added the like and share buttons to my forum. They are all working fine but the spacing isn't right. How do I adjust the spacing between the buttons so its all the same.
This is the code I copied and used.
<div align="left" style="background-color: rgb(255, 255, 255); width:100%; text-align:left; height: 25px;">
<div style="float:left; position:relative; top:2px; left:2px;">
<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/en_US/all.js#xfbml=1&appId=";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div>
</div>
<div style="float:left; position:relative; top:2px; padding-left:30px;">
<a href="https://twitter.com/share" class="twitter-share-button" data-via="" date-via="vBulletin" data-lang="en">Tweet</a>
</div>
<div style="float:left; position:relative; top:2px; padding-right: 30px;">
<a href="https://twitter.com/rensportclub" class="twitter-follow-button" data-show-count="false">Follow @rensportclub5</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);j s.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div style="float:left; position:relative; top:2px;">
<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone" data-size="medium"></div>
</div>
Here is how it looks on my forum
https://vborg.vbsupport.ru/external/2016/07/1.png?1
As you can see the spacing between each button isn't the same.
This is the code I copied and used.
<div align="left" style="background-color: rgb(255, 255, 255); width:100%; text-align:left; height: 25px;">
<div style="float:left; position:relative; top:2px; left:2px;">
<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/en_US/all.js#xfbml=1&appId=";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div>
</div>
<div style="float:left; position:relative; top:2px; padding-left:30px;">
<a href="https://twitter.com/share" class="twitter-share-button" data-via="" date-via="vBulletin" data-lang="en">Tweet</a>
</div>
<div style="float:left; position:relative; top:2px; padding-right: 30px;">
<a href="https://twitter.com/rensportclub" class="twitter-follow-button" data-show-count="false">Follow @rensportclub5</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);j s.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div style="float:left; position:relative; top:2px;">
<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone" data-size="medium"></div>
</div>
Here is how it looks on my forum
https://vborg.vbsupport.ru/external/2016/07/1.png?1
As you can see the spacing between each button isn't the same.