CSS to achieve a similar fixed floating div thast always on top of other divs - like stackoverflow does?

Question

I'd like to achieve a similar effect as the one in this image:

Basically, I want to have a div as a menu bar that's always on top - the div beneath it being the container div for my content. Clicking any links in my menu bar only change the content in the container div.

Solution

You need to use the position: fixed; property for #top div.

<div id="top"></div>

#top {
  position:fixed;
  top:0px;
  width:100%;
  height:70px;
}