CSS:
.share {
width: 150px;
height: 20px;
background: #000;
float: right;
white-space: nowrap;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 3px;
background-color:rgba(255, 255, 255, 0.5);
border-bottom-left-radius: 5px;
box-shadow: 0px 0px 10px #888;
vertical-align: top;
}
HTML:
<div class="share">
<div class="fb-like" data-href="http://bronies.info/" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true" style="width:47px; overflow:hidden; top:-3px; left:3px;"></div>
<a href="https://twitter.com/share" class="twitter-share-button" data-text="Wondered what the bronies were all about?" data-count="none">Tweet</a>
<div class="g-plusone" data-size="medium" data-annotation="inline" data-width="300" style="width:32px; overflow:hidden;"></div>
</div>
Chrome, Safari:
Internet Explorer, Firefox, and Opera:
If you can see what I did in my HTML style
property, I used top:-3px
, and I did this before testing my website out on other browsers (Chrome is my primary web browser). I used top
because a quick Google search led me a page instructing me to do so. Now that this solution doesn't work, how would I adjust it to align and work on all web browsers?
"We are removing Likes and focusing on Followers to simplify the way people connect with their favorite Pages. Unlike Likes, Followers of a Page represent the people who can receive updates from Pages, which helps give public figures a stronger indication of their fan base," said Facebook in a blog post.
When a user clicks the like button, the content appears in the News Feeds of that user's friends. The button also displays the number of users who liked each piece of content, and may show a full or partial list of those users.
Go to Settings › General, then click the Share tab. Enable the Facebook Like/Recommend button setting by clicking the “thumb up” Like icon.
My solution is:
.fb-like.fb_iframe_widget span{
vertical-align: top !important;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With