I am designing a website am having trouble getting one area of the css to work. I am trying to get the the header image to sit on top of the navigation image. The header file is a transparent gif that has a little area that I want to run into the nav. When I open it up with Web expression it looks right but when I actually display it in firefox the nav.jpg image is on top of the fullheader.gif. I have searched all over the web but couldn't find any answers.
Ok I posted them up to http://www.scom2k7.com/website/.
It still doesn't look right to me. I changed the color so it would stand out better. Basically I want to orange header to sit on top of the sliver nav. If you look in the bottom left corner of the orange header you will see when I wan't it to overlap.
That didn't seem to work. I updated the website with what you suggested. All it did was move the nav bar down. I want the header to sit partially on top of the nav bar.
I have attached a file that contains the layout.
Thanks,
Tmac
Also, upload these files to a server and gives us a link, people are not generally willing to download a .zip.
It still doesn't look right to me. I changed the color so it would stand out better. Basically I want to orange header to sit on top of the sliver nav. If you look in the bottom left corner of the orange header you will see when I wan't it to overlap.
Thanks,
Your header image is 120px tall, but you've set the height div that it is in to 110px. Change that to 120px.
Here you go:
#masthead {
position:relative;
height: 120px;
z-index:9999;
}
#top_nav {
margin-top:-10px;
}
Tmac