javascript - 使用位置 :fixed; 的问题

Question

我搜索了所有类似的帖子和谷歌，但没有找到答案，所以我希望这不是重复的帖子，如果是，我深表歉意。

我试图使用固定位置将标题栏保持在页面顶部。我现在不为 IE 编写代码，而是使用最新的 Chrome 和 Firefox 进行测试。我知道 position:fixed 是相对于浏览器窗口的，所以症状是有道理的，但我找不到解决方法。

当我添加 position: fixed;到标题，它把它聚在一起并推到右上角，我无法让它再次在页面上展开，也无法将其他 div 向下推。我不愿意使用固定宽度，因为我想让页面尽可能地流畅。

我愿意使用 javascript/jquery php 或任何它需要的东西。我也确信这是一个简单的修复，但我就是想不通。下面的 CSS。

body {
background-image:url(images/background_image/skyblue.jpg);
min-width:1100px;
padding-left:40px;
padding-right:40px;
padding-top:0;
padding-bottom:0;
margin:0;
background-color:#022F00;
}

.container {
background-color:#FFF;
padding: 0;
margin-left:auto;
margin-right:auto;
height:100%;
background-image:url(images/background_image/skyblue.jpg);
background-color:#022F00;
}

.header {
width:inherit;
background-color:ffffcc;
position:fixed;
left:auto;
right:auto;
}

.login {
float:right;
padding:0;
margin:0;
border:0;
}

.rightinfo {
background-color:#33F;
float:left;
height:200px;
width:20%;
border:thin;
-moz-border-radius:1em;
-moz-border-radius:1em;
-webkit-border-radius:1em;
-webkit-border-radius:1em;

}

.contentbackground {
background-image:url(images/background_image/skyblue.jpg);
background-color:#022F00;
float:left;
width:80%;
padding-top:10px;
}

我的照片还不允许发布，但可以通过电子邮件发送。我希望这是有道理的。感谢您的帮助!

Answer 1

对于全宽固定标题尝试:

.header {
 top:0;
 left:0;
 right:0;
 background-color:ffffcc;
 position:fixed;
}