Facebook像框小部件无法识别数据宽度属性？ [英] Facebook like box widget not recognizing data-width attribute?

问题描述

今天我刚刚注意到，Facebook Like Box小部件的data-width属性似乎没有起作用。看起来它正在恢复到默认宽度。在 http://blog.christopherjonesart.com 上可以看到我正在谈论的一个例子。

I just noticed today that the data-width attribute for the Facebook Like Box widget does not appear to be working. It looks like it is reverting to the default width. An example of what I'm talking about can be seen on http://blog.christopherjonesart.com.

这是我使用的代码（这是很标准的）：

Here is the code I'm using (it's pretty standard):

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class="fb-like-box" data-href="http://www.facebook.com/christopherjonescomicart"    data-width="190" height="395" data-show-faces="true" data-border-color="black" data-stream="false" data-header="true"></div>

我在几个网站上遇到这个问题。它正在Chrome，Firefox，Safari和Internet Explorer中进行。我最近没有更新Wordpress或对我的css进行任何更改。

I am experiencing this issue on several websites. It is doing it in Chrome, Firefox, Safari and Internet Explorer. I have not recently updated Wordpress or made any changes to my css.

帮助？看起来真的很像这样。 ： - （

Help? It looks really crummy like this. :-(

推荐答案

扩展user2477225的答案，可能会在您设置的自定义定位（相对或绝对位置页面），所以我做的是：

Expanding on user2477225's answer, it might have problems with custom positioning that you set (relative or absolute somewhere on the page), so what I did was:

.fb_iframe_widget>span { width: 240px !important; }
.fb-like-box iframe { width: 240px !important; }

似乎要工作到目前为止。

Seems to be working so far.

修改：对于IE 8（和更低版本），请使用此相反：

Edit: For IE 8 (and lower), please use this instead:

.fb_iframe_widget span { width: 240px !important; }
.fb-like-box iframe { width: 240px !important; }

我喜欢尽可能具体在我的选择器中，但是在检查了这个问题之后，我看到没有技术上的理由在这里使用> 选择器。

I like to be as specific as possible in my selectors, but after checking this issue some more, I see no technical reason to use the > selector here.

这篇关于Facebook像框小部件无法识别数据宽度属性？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！