中心对齐Facebook分享按钮div

这是我认为会很直接，但结果是有点痛苦。我试图居中对齐Facebook的社交按钮的图标下，你可以在这里看到：中心对齐Facebook分享按钮div

我有点坚持的想法，我试图迫使它一个div内，仍然不会让步...

<div class="Facebook"><img src="http://creditworksusa.com/wp-content/uploads/2014/03/facebook-icon-png-white.png" width="30"/> 
<iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FRazorRuddockRacing%3Ffref%3Dts&amp;width&amp;layout=button_count&amp;action=recommend&amp;show_faces=false&amp;share=false&amp;height=21&amp;appId=637719322983790" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px; display: block; margin: 0 auto;" allowTransparency="true"></iframe> 
</div> 


.Facebook{ 
    float: left; 
    background-color: #3B5998; 
    width: 50%; 
    text-align:center; 
    padding: 20px 0; 
}

来源

2014-09-22 stacking

你拨弄没有表现出任何结果 – dippas 2014-09-22 14:49:10

@dippas上运行 – 2014-09-22 14:50:32

点击我想我可以帮你，但究竟是你想中心，我找不到，在小提琴 – 2014-09-22 14:51:17

添加这将工作：

iframe { 
    display: block; 
    width: 125px; 
    margin: auto; 
}

然而，随着越来越多的数字被添加到喜欢，你的宽度需要得到更大的到O操作。这并不是一个很好的解决方案，但是如果没有设置宽度，您无法将边距设置为自动以使其起作用。

来源

2014-09-22 14:51:44 James

Facebook社交按钮始终为124px宽。只要给iframe一个宽度并居中就可以了。

iframe { 
    width: 124px; 
    text-align: center; 
}

http://jsfiddle.net/ak2om8Lh/1/

来源

2014-09-22 14:51:54

只是想知道，在那里是指示它总是124px宽的文档？我在这里找不到任何引用：https：//developers.facebook.com/docs/plugins/like-button – Alex 2014-09-22 14:54:25

检查詹姆斯他的答案。当喜欢的数量增加时，宽度将改变。你需要用JS来解决它。抱歉。 http://stackoverflow.com/a/25977036/3398302 – 2014-09-22 14:55:17

感谢您的建议家伙。 – stacking 2014-09-22 15:05:58

-1

裹的iframe到一个div并添加保证金：汽车
居中，这不会更改包含div宽度，
，让你更自由地你的元素位置。

.frame{ 
    display: block; 
    width: 100px; 
    margin: auto; 
}

来源

2014-09-22 15:10:32 yoyo1990

中心对齐Facebook分享按钮div

回答

相关问题