浏览器正在生成奇怪的边框

Question

我今天去 Chrome 中测试我的网站，我注意到浏览器在我网站的某些部分周围创建了一个奇怪的边框。它是一个白色边框，包含窗口的右侧和底部，以及侧边栏菜单的右侧。我不记得昨天测试该网站时有这个边框。我以为是浏览器错误，于是在 Safari 中打开该网站，结果出现了同样的问题。我有一种感觉这是用户错误（可能是一个非常愚蠢的错误），但我不知道如何摆脱它。在该边框消失之前我无法正确测试该网站

我没有将此边框写入我的代码中，它似乎是浏览器中打开的某种设置，但我不知道如何将其关闭。我在下面添加了“神秘边框”的图像。

图片在这里

Code is here

http://jsfiddle.net/Feu8H/

Answer 1

尝试将其添加到您的CSS中：

body{margin: 0;
     padding: 0;}

#nav_container{margin: 0;
     padding: 0;}

如果这不起作用，请尝试添加此类：

.cBoth{clear: both;}

并在 #nav_container div 之后写入此 div：

希望能够消除边框。

Answer 2

那些边框来自卷轴。在 html 中将

overflow:scroll;

替换为

overflow:hidden;

，body 标记将删除这些边框，但滚动也会删除。对于侧边栏，请查看#nav_bar 并进行相同的替换。 http://jsfiddle.net/Feu8H/3/

帖子编辑：更好的解决方案是使用

overflow:auto;

代替

overflow:hidden;

，因为使用

overflow:hidden

可能会使某些访问者看不到所有内容。

Answer 3

好吧，这就是问题所在。它与我的任何代码无关。事实上，这与我的电脑设置（OSX Mountain Lion）有关。我在构建网站时通常使用触控板，但今天我碰巧连接了 USB 鼠标。系统偏好设置>个人>常规中有一个设置可以根据您连接的鼠标外围设备更改滚动条的显示方式。连接 USB 鼠标会导致滚动条始终显示，无论您是否滚动。这些“神秘边界”就是滚动条。我刚刚更改了设置，现在一切正常。