• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

static navigation header......

I have been struggling to build a concept I had in my head..... Which is to have a static navigation bar or banner across the top of the webpage, I want it to look like the content is scrolling behind the banner, which may have opacity so cant just do that.
Any ideas anybody? Would be much appreciated cos I am frying brain cells here


Staff member
In css (this is for a css file) put something like the below, assuming the banner id is 'banner'.
#banner {width:100%; 
background:rgba(255, 255, 255, 1);
position: fixed;
width is 100% of page width
background is colour of banner, in this case rgb plus alpha channel for opacity
position fixed sticks it in same place
top: 0 - 0 pixels from top of page
z-index 'raises' it above normal content that will be at 0 usually