How to stop body text from 'scrolling' over ('in front of') a fixed header

[Allan Jamieson]

I have set up a fixed header but when I use the scroll bar to move the body text, the top rows of text move 'in front of' the header. I want the text to disappear 'behind' the header so that the header's appearance does not change. How? Here is my latest unsuccessful attempt:

#header {
left: 150px;
right: 3px;
border-top: 3px solid #7da5d8;
}

@media screen{
body>div#header{
position: fixed;
}

}
* html body{
overflow:hidden;
}

[Limotek]

Take a look at the z-index attribute. The below article explains it quite well.

http://css-discuss.incutio.com/?page...ppingAndZIndex

[Allan Jamieson]

I have just found the time to read your reply and test it. Your answer worked briiliantly!

Allan