开发者

Problems using position:fixed;

I have searched through all the similar posts and google and have not quite found an answer so I hope this is not a double post and I apologize if it is.

I am trying to keep my title bar on the top of my page using position fixed. I 开发者_开发问答am not coding for IE right now and am testing with the latest Chrome and Firefox. I know position:fixed is relative to the browser window so the symptoms make sense but I cannot find a cure.

When I add position: fixed; to the header it bunches it up and shoves it in the top right corner and I cannot get it to spread out across the page again, or push the other divs down. am reluctant to use a fixed width because I would like to keep the page as liquid as possible.

I am open to javascript/jquery php or whatever it takes. I also am sure it is a easy fix but I just cannot figure it. CSS below.

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;
}

I have pictures that I am not allowed to post yet but can email. I hope this makes sense. Thanks for any help!


for a full width fixed header try:

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

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜