Jak naprawić nagłówek na przewijanie

Tworzę nagłówek, który po przewinięciu do pewnej ilości pikseli, które naprawia i pozostaje na swoim miejscu.

Czy mogę to zrobić używając tylko css i html, czy też potrzebuję jquery?

Stworzyłem demo, żebyś mógł zrozumieć. Każda pomoc byłaby świetna!

http://jsfiddle.net/gxRC9/4/

body{
    margin:0px;
    padding:0px;
}
.clear{
    clear:both;
}
.container{
    height:2000px;
}
.cover-photo-container{
width:700px;
height: 348px;
margin-bottom: 20px;
background-color:red;
}

.small-box{
    width:163px;
    height:100px;
    border:1px solid blue;
    float:left;
}

.sticky-header{
    width:700px;
    height:50px;
    background:orange;
    postion:fixed;
}

questionAnswers(10)

yourAnswerToTheQuestion