1

我一直很难找出这个问题的解决方案。

首先,看看这个页面

这是建立在响应式设计中的,因此当您缩小窗口时,一切都适合窗口。除了,右边的标签似乎超过了窗口的大小。此外,如果您比较顶部导航栏的填充,则左侧和右侧的填充量在应该保持不变时是不同的。

我正在同时使用 firefox 和 chrome 来调试这个问题。控制顶栏的 CSS 是

.fixed_pos {
    position: fixed;
    width: 85%;
}

并在application.css中填充身体

body {  
    padding-right: 100px;
    padding-left: 100px;
    min-height: 100%;
}

宽度设置为 85%,因为当我将其设置为 100% 时,导航栏也超过了窗口大小(即使在我去掉了所有的主体填充之后)。我希望导航栏和标签能很好地适应窗口而不是超过窗口宽度,但我似乎无法让它工作。

我很感激这方面的任何帮助。

4

1 回答 1

0

您在 body 上定义了 padding (100px),然后在固定位置上定义了 100% 的宽度。所以你的 div 的大小是窗口的 100%,从位置 (100,0) 开始。这就是为什么它超过了窗口。

如果你想定义 100% 的剩余宽度,你必须声明你的 position 属性以保持在流中,例如:

.fixed_pos {
    position: static; // or nothing, or relative
    width: 85%;
}
于 2012-12-27T09:19:26.697 回答