How to set a fixed header within the Twenty Twelve WordPress theme?

Sam666

New Member
Having started to create my own Wordpress Blog, I have got stuck on fixing my Header in place.I have had only slight exposure to CSS/JavaScript so I am winging it as I learn along the way! Most of what I want to achieve has already been done, but I would just like to try and get this header fixed before I add my posts etc.Upon searching this on the Interne I can only really find the below and added this into my style.css file;\[code\]#masthead {position:fixed; top:0px; margin:auto; z-index:100000; width:100%;}\[/code\]this now fixes the Header Image and Navigation in place, but slightly off center, but the rest of my page falls behind this still now. One problem is that the actual background of the Image and Nav is opaque.. please see the screenshot below\[code\]Before code - http://tinypic.com/r/2vxm69t/6After code - http://tinypic.com/r/34jd2t1/6\[/code\]I believe I need to maybe create a separate 'div' within my header.php, or amend this in some way but tbh, I am not 100% sure on what actually would make this work as I have never done this before. Ideally, the line I added below the Nav links, shown on the screenshot before adding this code, this would indicate the bottom of the header and as you scroll, the rest would disappear under this. The background as a whole would remain white, and in center to the rest of the page, still including the gap at the top which revels the background.!! I must apologise for the screenshots, it isn't very clear but I hope this shows what is happening and is clear enough, I will be hosting this asap!Links to my 'style.css' & 'header.php' are as follows - if you need anything else please let me know;\[code\]style.css - http://codepad.org/c4BnqxlFheader.php - http://codepad.org/w4z19VLW\[/code\]I hope somebody can help as I think this will look great on my blog, then I can get posting!
 
Back
Top