将“喜欢”按钮浮动到右侧答案

【问题标题】：Floating a Like button to the right将“喜欢”按钮浮动到右侧
【发布时间】：2019-11-19 21:01:30
【问题描述】：

我的问题基本描述为here。我需要将一个 FB Like 按钮浮动到右侧，考虑到按钮的宽度会根据语言（和喜欢的数量）而有所不同。

虽然不可能操纵属于不同域的iframe 中的元素，但我仍然想知道是否有一些奇特的方法可以对其进行处理。我不敢相信没有办法让该死的 Like 按钮向右浮动。

【问题讨论】：

实际解决方案 — stackoverflow.com/a/9670314/535406

【解决方案1】：

给按钮一个包装器。

<div id="likeWrapper">

</div>

<style>
#likeWrapper{
   float:right;
}
</style>

【讨论】：

不会删除按钮右侧由固定宽度引起的空间。
你总是可以用javascript覆盖它。这可能会很痛苦，但我相信这是可能的。这个“固定宽度”设置在哪里？如果它是类似按钮的代码，我相信你也可以编辑它……我以前做过。 ORRR.... 改为自定义喜欢按钮。

【解决方案2】：

我相信你不能仅仅通过html和css来做到这一点，因为按钮的固定宽度，你总是需要在右边有一些额外的空间，即使你把按钮浮动到右边。

有一个快速肮脏的黑客，但它只适用于一种特定的语言 -

.like{
  position: absolute;
  float:right;
  right: -20px; /*change this to fit your layout */
}

但是您看到了这个问题：如果赞按钮在另一种语言中较长，它将超出您的布局。

所以我们可以通过 javascript (jQuery) 来做到这一点，比如先获取 like 按钮的 getWidth，然后将其向右移动所需的像素数量。我无法为您提供确切的代码，我对 jQuery 有点生疏，但这是基本思想：获取显示按钮的宽度，然后使用 jQuery 更改 right: css 属性以匹配您的布局。

【讨论】：

据我所知，不仅仅是编辑不能在不同的域 iframe 中完成，它甚至可以访问/阅读。所以我无法获得 iframe 内任何东西的宽度。

【解决方案3】：

只需将实际 iframe 浮动到右侧。

【讨论】：

相同评论：不会删除右侧因固定宽度而产生的额外空间。