使用框计数布局将Facebook按钮评论弹出窗口固定在右侧

Nic*_*ier 5 comments facebook popup button alignment

我正在尝试正确对齐Facebook按钮的评论弹出窗口.我正在使用盒数布局,以便我可以对齐右侧的所有Facebook/Twitter/Google +/Whatever按钮.

这是我的实际页面布局.看起来我想要. 我的实际按钮布局,看起来很好

但是,一旦我单击Like按钮,注释弹出窗口就会从左侧锚定并且不在窗口中.游民. 糟糕的结果

我想要的只是将弹出窗口从右侧而不是左侧锚定 谷歌的+1按钮做得恰到好处,为什么不是Facebook呢? 我尝试了所有版本的按钮.IFRAME版本不显示评论框但无法正确对齐.HTML5和XFBML已正确对齐,但它们都显示窗口外的弹出窗口.

我没有看到Facebook文档中的任何参数来调整注释弹出窗口的对齐方式或强制在真实的浏览器弹出窗口中打开注释弹出窗口.顺便说一句,这不能通过CSS调整,因为该死的弹出窗口是一个该死的IFRAME,即使我正在使用HTML5和XFBML标记.

有一个干净的方式:

  1. 将此弹出窗口固定在右侧
  2. 在实际的浏览器弹出窗口中打开弹出窗口(window.open())
  3. 隐藏弹出窗口

有没有办法实现这一目标?Google +1按钮可以完美地完成工作,而无需添加大量代码.

当然,简单的解决方案是将我的按钮移动到左侧,但它很糟糕.

任何帮助将不胜感激.谢谢 :)

小智 0

尝试这个

<center>
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1">
</script><iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FID_HERE&amp;layout=standard&amp;show_faces=false&amp;colorscheme=light&amp;width=50&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:30px;" allowtransparency="false"></iframe>
Run Code Online (Sandbox Code Playgroud)

将 ID_HERE 替换为您的页面 ID