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.

Smaltite

Possible duplicate of: https://mcmap.net/q/1479316/-div-with-fixed-position and many more... – Hamburg

@ithcy: Not much going on there. – Dzerzhinsk

Answer 1

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

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

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

Alberik

Answer 2

You need to have a div and assign the CSS classes:

.className {
width: 100%;
position: fixed;
top: 0px;
height: 75px;
}

Then on your div have: <div class="className">Whatever</div>

Policeman