liamloveslearning Posted November 3, 2009 Share Posted November 3, 2009 Hi everybody, I have a wrapper div centered with relative positioning, I then have my header div inside which I would like to be fixed so it doesnt scroll as the rest of my page scrolls, However its positioning itself fixed in relation to the browser window and not the container div, I know its something simple im missing but its causing me nightmares!! heres my code if anybody can figure it out, thanks main page <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <link href="style.css" rel="stylesheet" type="text/css" /> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Tint Wizard</title> </head> <body> <div id="wrapper"> <div id="header">sdfsdf</div> <div id="content">sdfsdfsdfsdf</div> </div> </body> </html> and my CSS file body { margin:0; } #wrapper { width:964px; margin:0 auto 0 auto; background-image:url('images/grid.jpg'); padding:0 6px 0 6px; min-height:600px; position: relative; } #header { height:250px; left:15px; margin-left:0; overflow:visible; padding:0 0 0 161px; position:fixed; top:7px; width:141px; } #content { background:transparent url(/images/sitewide/bg-contentArea-white.png) repeat-y scroll 327px top; padding:209px 15px 31px 337px; width:624px; } Quote Link to comment Share on other sites More sharing options...
liamloveslearning Posted November 3, 2009 Author Share Posted November 3, 2009 fixed! #header { height:500px; left:50%; margin-left:-473px; overflow:visible; padding:0 0 0 161px; position:fixed; top:7px; width:141px; } Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.