使Fb和twitter小部件响应

Question

如何使Fb和Twitter小部件在所有设备上响应？我试图将iframe宽度设置为100%但是当我在智能手机中查看时,它会延伸布局,从而导致水平滚动条.这也适用于youtube视频.

Answer 1

尝试:

#twitter-widget-0{
   width: 100% !important;  
}

Answer 2

对于推特!我发现最简单的解决方案是通过CSS.将.twtr-doc类编辑为宽度为100%.

对于FB(假设你说的是盒子)我把第一个宽度改为auto,第二个宽度(内联css)改为100%我将以可口可乐为例......

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fcocacola&amp;width=auto&amp;height=395&amp;colorscheme=light&amp;show_faces=false&amp;border_color&amp;stream=true&amp;header=false&amp;appId=176993455739426" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100%; height:395px;" allowTransparency="true"></iframe>