/    Sign up×
Community /Pin to ProfileBookmark

Making four social like buttons align

Hello,

How would I make these 4 social like buttons align in a vertical row? Right now they are on my website vertically. I want to put them in the sidebar

The 4 are Facebook like, Twitter share, Google+ share, and a Russian site

[CODE]
<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″;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
<div class=”fb-like” data-href=”https://website.com” data-layout=”button_count” data-action=”like” data-show-faces=”true” data-share=”false”></div><br>

<a href=”https://twitter.com/share” class=”twitter-share-button” data-url=”http://website.com” data-via=”twitter”>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?’http’:’https’;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+’://platform.twitter.com/widgets.js’;fjs.parentNode.insertBefore(js,fjs);}}(document, ‘script’, ‘twitter-wjs’);</script><br>

<div class=”g-plus” data-action=”share” data-annotation=”bubble” data-href=”http://website.com”></div>

<script type=”text/javascript”>
(function() {
var po = document.createElement(‘script’); po.type = ‘text/javascript’; po.async = true;
po.src = ‘https://apis.google.com/js/plusone.js’;
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(po, s);
})();
</script><div id=”ok_shareWidget”></div>

<script>
!function (d, id, did, st) {
var js = d.createElement(“script”);
js.src = “http://connect.ok.ru/connect.js”;
js.onload = js.onreadystatechange = function () {
if (!this.readyState || this.readyState == “loaded” || this.readyState == “complete”) {
if (!this.executed) {
this.executed = true;
setTimeout(function () {
OK.CONNECT.insertShareWidget(id,did,st);
}, 0);
}
}};
d.documentElement.appendChild(js);
}(document,”ok_shareWidget”,”http://website.com”,”{width:145,height:30,st:’oval’,sz:12,ck:3}”);
</script>
[/CODE]

to post a comment
CSS

2 Comments(s)

Copy linkTweet thisAlerts:
@arronmattwillsDec 01.2013 — Use font awesome css. You can get all social icons as a text then no problem.

Now a days web desgners are using icons as font.
Copy linkTweet thisAlerts:
@SEO_LandDec 02.2013 — I always get Social Media buttons embed code from 'Add me This' site as per my need viz. vertical or horizontal.
×

Success!

Help @kbn spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.9,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...