posizionamento di pulsanti Facebook like e google + in linea?

Question

Qualcuno ha qualche trucco per allineare questi due pulsanti su una pagina? Di default la versione iframe del pulsante Mi piace di Facebook appare sotto il pulsante di google plus o viceversa. Ci sono trucchi css per tenerli in linea?

Questo è il mio tentativo di corrente

<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

metterli in una lista - Ecco quello che ho fatto (scusate il 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> 

E il 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

Probabilmente genitore larghezza div è minore somma di questa larghezza due iframe.

L'iframe FB ha una larghezza di 350 px. Ma come il pulsante è più piccolo.

Answer 3

Bisogna includerli in un involucro div . Tuttavia, il reale è la visualizzazione sulla stessa linea per me

il tuo codice: http://jsfiddle.net/HbYn3/

Answer 4

Usare il seguente Google Plus rendono fonte:

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

È possibile regolare il margine con il vostro requisito. Era il mio requisito per Kuwar Dheeraj Srivastava a One Click Lyrics India