Question

有没有办法将google plus按钮对齐？似乎g +按钮保留了一些位置，以防有更多的数字。如果sulution只能使用css / html，那就太好了 - 没有javascript。

更新
自从昨天以来谷歌已经改变了1+按钮的一点点api，但似乎无法将它对齐到右边。

更新2
问题已于2011年8月24日提出。从那时起，Google+已经多次改变。这个帖子不再需要垃圾邮件的答案（重复，同样的答案！）。您所有建议的选项当时都不存在。查看google +文档网页上的参数：https://developers.google.com/+/plugins/+1button/?hl=pl#plusonetag-parameters

Answer 1

现在您只需将data-align="right"添加到<div>即可。例如：

<div class="g-plusone" data-align="right" data-size="medium" data-href="http://www.mywebsite.com"></div>

这将使<iframe>的内容保持在右侧。

Answer 2

如果您想正确对齐+1按钮，则应使用“高”外形，因为它会向上展开，或将+1按钮配置为不显示计数。这些中的任何一个都将消除右侧数字的松弛空间。可以在此处找到解释如何执行此操作的文档：http://code.google.com/apis/+1button/#button-sizes

现在，填充在右侧消失，您可以使用CSS来对齐按钮。

Answer 3

将以下属性添加到 g：plusone 标记：

align="right"

从中获得解决方案 https://developers.google.com/+/plugins/+1button/#button-sizes

Answer 4

为+1按钮标记设置align属性为right。

<g:plusone align="right"></g:plusone>

Answer 5

我找到的最简单的解决方案是将加一个按钮div包装在一个容器中，为容器提供一个类和样式，以便根据需要浮动。

<!-- Google +1 button -->
<div class="plusonealign"><div class="g-plusone" data-size="medium"  data-align="left"></div></div>

.plusonealign {
    float: left;
}

Answer 6

我会尝试将按钮放入div。然后我会使这个div小于按钮，以切掉按钮的右侧部分。您需要调整css中的position和overflow选项。

Answer 7

昨天遇到了这个确切的问题。包装了namedspaced加上一个div中的一个标签并向右浮动。

你总是可以使用样式表覆盖谷歌发送的内联样式

所以对于这样的标记：

<div class="myPlusOneWrapper">
    <div id="theActualPlusOneWrapper" style="whatever google send down the wire">
        <!-- blah -->
    </div>
</div>

你可以拥有这个CSS：

.myPlusOneWrapper
{
     float: right;
}

.myPlusOneWrapper > div
{
    width: auto !important;
}

然后宽度将适应所需的宽度，并优先于谷歌的内联样式

JS Fiddle

Google+按钮删除右侧的可用空间/边距对齐到右边

7 个答案: