umieszczanie wbudowanych przycisków facebook like i google +?

Question

Czy ktoś ma jakieś sztuczki, aby wyrównać te dwa przyciski na stronie? Domyślnie wersja przycisku Facebook takiego jak Facebook pojawia się pod przyciskiem Google plus lub na odwrót. Czy są jakieś sztuczki CSS, aby utrzymać je w linii?

To moja obecna próba

<div style="float:left;width:100px;"> 
    <!-- Place this tag where you want the +1 button to render --> 
    <g:plusone></g:plusone> 

    <!-- Place this tag after the last plusone tag --> 
    <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> 
<div style="float:left;width:auto;"> 
    <iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fmy_site&amp;layout=button_count&amp;show_faces=false&amp;width=350&amp;action=like&amp;font=lucida+grande&amp;colorscheme=light&amp;height=40" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:350px; height:30px;" allowTransparency="true"></iframe> 
</div> 

Answer 1

umieścić je na liście - oto co mam zrobić (excuse JSP)

<ul class="like-buttons"> 
<li class="g-plus-one"> 
    <g:plusone count="false"></g:plusone> 
</li> 
<li class="twitter-like"> 
    <a href="http://twitter.com/share" class="twitter-share-button" data-url="<%= url %>" data-count="none">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> 
</li> 

<li class="fb-like"> 
    <iframe src="http://www.facebook.com/plugins/like.php?href=<%= facebookUrl %>&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=dark&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:350px; height:30px; color:#fff!important;" allowTransparency="true"></iframe> 
</li> 

A css:

ul.like-buttons{ 
float: left; 
list-style: none; 
margin: 5px 0 20px 0; 
padding: 0; 
width: 100%; 
} 

ul.like-buttons li{ 
    display: block; 
    float: left; 
    margin-right: 10px; 
} 
li.twitter-like{ 
    margin-top: 2px; 
} 

Answer 2

Prawdopodobnie rodzic div szerokość jest mniejsza niż suma tych dwóch iframe width.

Twoja ramka FB ma szerokość 350 pikseli. Ale jak przycisk jest mniejszy.

Answer 3

Trzeba uwzględnić je w div otoki . Jednak rzeczywisty wyświetla na tej samej linii dla mnie

kodzie: http://jsfiddle.net/HbYn3/

Answer 4

Poniższa Google Plus uczynić źródło:

<div style="margin-top: 11px;"><li class='g-plusone' data-size='tall'/></div></div> 

można regulować margines z zapotrzebowania. To było moje wymaganie. Przez Kuwar Dheeraj Srivastava pod One Click Lyrics India