2015-05-09 45 views
0

看起来Facebook已决定将类似框改为页面插件,并将最大大小限制为500px。使Facebook页面插件响应(到处搜索并找不到解决方案)

页的剧本:http://akecheta.com/facebooklikeplugin-responsive.html

我的问题是究竟那一个,我不能在likebox使用全宽度的布局。以下是我试过到目前为止:

/* Fits the like box to the parent div, creating a fluid layout */ 
#u_0_0 > div { 
    width: 100% !important; 
} 
/* Fits the background image to the like box */ 
.uiScaledImageContainer._2zfr { 
    width: 100% !important; 
} 

/* Modifies the first background color of the fans part */ 
._h7l { 
    background: #EE6C00 !important; 
} 
/* Modifies the second background color of the fans part */ 
._h7n { 
    background: transparent !important; 
} 
/* Modifies the color of the text above the fans thumbnails */ 
/* Modifies the color of the text above the fans thumbnails */ 
._50f3 { 
    font-size: 150%; 
    line-height: 25px; 
    color: #FFFFFF !important; 
} 

它工作得非常好飞,但后来我保存这些更改我的样式表,什么都没有发生。

所有的类都在页面加载时更改,但是ID #u_0_0仍然保持不变。就好像它不存在一样。

现在我想为这个问题想一个解决方案,因为我需要使用全页面插件的页面插件。

+0

你可以发布您的网站或者我们可以看看在实际执行这个插件的另一个地方? –

+0

这里http://akecheta.com/facebooklikeplugin-responsive.html – user3692451

+0

当你在devtools中执行它时,你的CSS工作的原因,而不是当你把它放在你的样式表时,是因为插件被加载的iframe不能在CSS外面使用CSS样式。样式化iframe的唯一方法是从iframe内部进行。由于您是以第三方插件的形式加载的,因此您需要寻找一种方法,在完全加载后将样式动态插入iframe。看到这个问题在你想要做的更多方向:http://stackoverflow.com/questions/624979/append-a-stylesheet-to-an-iframe-with-jquery –

回答

0

当你在devtools中执行它时,你的CSS工作的原因,而不是当你把它放在你的样式表时,是因为插件被加载的iframe不能被CSS以外的样式所调用。样式化iframe的唯一方法是从iframe内部进行。由于您是以第三方插件的形式加载的,因此您需要寻找一种方法,在完全加载后将样式动态插入iframe。

见你正在尝试做的这个问题,多一点方向:Append a stylesheet to an iframe with jQuery