undogueOccugs
New Member
I want to keep the content of my page to always appear beneath the navigation bar, similar to how this page works:http://www.google.com/intl/en/enterprise/apps/business/products.html#calendarYou can scroll down or up in the content, but the navigation bar never goes away.For this purpose, I've used \[code\]position:fixed\[/code\] to fix the navigation bar to the top of the page. This works, but I'm still able to scroll the content up and down, causing it to run 'through' and over the navigation bar, when I want the content to always be pushed below the navigation bar.Any ideas on how to do this? Here's my css code for the \[code\]<ul id='navigation'>\[/code\] containing the navigation:\[code\]#navigation{ text-align: center; position: fixed; float: left; margin: 0; padding: 0; top: 0; left: 0; list-style-type: none;}#navigation li{ display: inline-block; width: 150px; height: 110px; cursor: pointer;}\[/code\]And here's the css for the \[code\]<div id="container">\[/code\] which appears below \[code\]#navigation\[/code\] and holds all of the page content body:\[code\]#container{ position: absolute; margin-top: 180px; font-size: 25px; width: 90%;}\[/code\]