Кнопка Google PlusOne имеет некоторое нижнее поле

Question

Я хотел бы знать, относится ли проблема, которую я вижу, к моему сайту или это известная проблема.

У меня есть некоторые социальные виджеты, которые довольно хорошо выровнены, но по какой-то причине PlusOne не выровнен правильно.

Я использовал Firebug для сравнения его с виджетом Facebook Like, и согласно CSS они оба имеют одинаковую высоту и не имеют полей или отступов. Их CSS выглядит идентично.

<div>
        <fb:like layout="button_count" show_faces="false" width="90" action="like" font="verdana" colorscheme="light"></fb:like>

        <g:plusone size="medium"></g:plusone>

        <script type="text/javascript" src="http://w.sharethis.com/button/sharethis.js#publisher=d9550e2f-f25a-4e2e-ae45-7a51cf7e3d46&amp;type=website&amp;buttonText=Share%20item!&amp;embeds=true&amp;style=rotate"></script>
        &nbsp;<font face='Verdana, Arial, Helvetica, sans-serif' size='1'><a href='/mmh/recommend/send.php?prodid=$!product.id'><img src="/images/icons/icon_email.gif" border="0"> Email item</a></font>
</div>

На самом деле у меня есть ссылка, где происходит то же самое: http://news.makemeheal.com/celebrity-plastic-surgery/jennifer-aniston-weighs-on-prince-williams-hair-loss/ (при необходимости уменьшите размер окна, чтобы Fbook и G + находились на одной строке)

Answer 1

Используйте это:

<span style="position:relative; top:3px">
<div class="g-plusone" data-size="small" data-annotation="none"></div>
</span>

Answer 2

Поместите div (class = froogle) вокруг кнопки +1, поместите их все, а затем стиль, как вы хотите. У меня это сработало:

.facebook-like, .twitter-share-button, .froogle {
  float: left;
  margin-right: 10px;
}

Answer 3

Была такая же проблема.Я поместил код Google+ в <div> и использовал CSS, чтобы ограничить свойство max-height от <div> до 70px, и это сработало.

Answer 4

Вы можете попробовать использовать относительное позиционирование, например, добавьте следующий CSS к кнопке G +:

position: relative;
top: 5px; /* Or whatever looks right */

Хотя это может решить вашу проблему, но точно не указывает причину проблемы.