Facebook Like按钮导致水平滚动条 [英] Facebook Like Button Causing Horizontal Scrollbar

问题描述

我最近在我的网站上添加了一个Facebook喜欢的按钮，导致当不需要时出现水平滚动条。

我在Firebug中检查过创建的代码，看不出有什么问题。

p>

这是指向该网站的链接，您可以查看： http：// www.swiftfurniture.com/

如您所见，在Firefox和IE（可能还有其他浏览器）上，有一个水平滚动条需要。

我已经在按钮上添加了一个固定的宽度div，包括overflow：hidden应用程序，但它似乎忽略了这一点。

我知道有很多其他问题类似于这一点，但使用PrestaShop我真的不想搞砸核心代码太多只是为了得到一个Facebook Like按钮工作（如果可能的话）。我希望一个解决方案，保持所有的代码包含在我创建的社会模块... ie - 只是一个文件，而不是搞乱PrestaShop的头文件等。

我已经在Firebug中查找了你的问题，可以分享一些可能有帮助的意见。 p>有一些代码被注入到你的< div id =fb-root>< / div> 样式宽度为575像素。

这是造成滚动条的原因。

I've recently added a facebook like button to my site and it's causing a horizontal scrollbar to appear when it's not needed. It doesn't appear in Chrome but is there in Firefox and IE.

I've checked the created code in Firebug and can't see what's going wrong.

Here's a link to the site so you can see: http://www.swiftfurniture.com/

As you can see, on Firefox and IE (possibly other browsers too), there's a horizontal scrollbar when it isn't needed. It's definitely the Facebook like button causing it, because when I comment that out, they disappear.

I've added a fixed width div around the button with overflow: hidden applied, but it seems to ignore that.

I know there's plenty of other questions similar to this, but with using PrestaShop I don't really want to mess around with the core code too much just to get a Facebook Like button working (if at all possible). I was hoping for a solution to keep all the code contained to the "social module" I've created... i.e - just one file rather than messing around with header files etc of PrestaShop.

解决方案

I've looked into your problem a bit with Firebug and can share some observations that might be helpful.

There is code that is being injected into your <div id="fb-root"></div> and within that is an iframe with an inline style width of 575px.

That is what is causing the scrollbars.

这篇关于Facebook Like按钮导致水平滚动条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！