How to keep the header static, always on top while scrolling?

Question

How would I go about keeping my header from scrolling with the rest of the page? I thought about utilizing frame-sets and iframes, jus

Answer 1

Instead of working with positioning and padding/margin and without knowing the header's size, there's a way to keep the header fixed by playing with the scroll.

See the this plunker with a fixed header:

  
Header
  
Content - very long Content...

The key here is a mix of height: 100% with overflow.

See a specific question on removing the scroll from the header here and answer here.