Ik wil op iedere pagina een Twitter, Facebook like en een Google plus button maar ik krijg de knoppen niet goed naast elkaar. De code ziet er nu als volgt uit:

Code:

  
<ul>
<li>Share this post:</li>

<li><a href="https://twitter.com/share" class="twitter-share-button" data-text="Just read something interesting:" data-count="horizontal" >Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></li>
                    
<li><iframe src="//www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink($post->ID)); ?>&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe></li>

<li><g:plusone size="medium"></g:plusone>
<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></li>

</ul>

Dit geeft echter de volgende output:


Hoe kan ik ze netjes op een rijtje naast elkaar krijgen?

Ik heb het volgende geprobeerd met CSS:

Code:

position:absolute;
margin: 0;
padding: 0;

Maar zonder gewenst resultaat. Ik niet wat ik er verder aan kan doen, zou iemand me hiermee kunnen helpen?

Code:

   <ul> <li>Share this post:</li>  <li><a href="https://twitter.com/share" class="twitter-share-button" data-text="Just read something interesting:" data-count="horizontal" >Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></li>                      <li><iframe src="//www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink($post->ID)); ?>&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe></li>  <li><g:plusone size="medium"></g:plusone> <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></li>  </ul>

Probeer deze is

Ja, het werkt! Dank je wel. Maar waarom werkt het nu wel, nu alles achter elkaar staat, en niet zoals ik het heb geschreven? Althans, zo te zien heb je niks aan de code veranderd?

Beste David,

Het komt door die facebook button, width was 450 die heb ik wat kleiner gemaakt naar 100px.

Mvg