html - CSS Fixing 对浏览器窗口有不寻常的影响

Question

我有一个侧边栏，其附加方式类似于http://thenextweb.com/

这是该错误的现场演示：http: //adamkochanowicz.com/static/build0502/kickstrap/_examples/contacts.html

要重新创建问题，只需向下滚动页面。

不知何故，我设法抓住了这个问题的截图： https ://s3.amazonaws.com/prod_object_assets/assets/4995413178034/grab_2013-04-12_a_3.00.59_PM.PNG?AWSAccessKeyId=AKIAJATICW4U3O4HFIEA&Expires=1367506772&Signature=DKQfG5DZSMHCzD2%D2

底部的灰色区域是当您在页面上向下滚动太远时会看到的“无人区”。

我正在使用 jQuery Waypoints 来检测何时将stuck类应用到侧边栏。

.stuck应用后，它会提供以下#sidebarCSS：

section#sidebar.stuck {
  width: 300px;
  position: fixed;
  top: 0;
  bottom: 0;
  border-color: #DDD;
  width: 25%;
  -webkit-box-shadow: 2px 2px 5px #eeeeee;
  box-shadow: 2px 2px 5px #eeeeee;
}

jQuery 非常简单：

<script>$('section#sidebar').waypoint('sticky');</script>

出于某种原因，当水平视口减小时不会出现此错误。例如，当我在 Chrome 中打开底部停靠的元素检查器时。

Answer 1

在第 866 行的 contacts.html 中，“.row”类的 CSS 行如下所示：

.row {
  margin-left: -15px;
  margin-right: -15px;
}

您的错误一旦被删除或设置为：

.row {
  margin-left: 0px;
  margin-right: 0px;
}