LearningSpot

. fixed - header { width : 100 %; margin : 0 auto ; position : fixed ; - webkit - box - sizing : border - box ; - moz - box - sizing : border - box ; - ms - box - sizing : border - box ; box - sizing : border - box ; z - index : 999 ; }

HTML     Please scroll                         This needs to be fixed when hits top of screen         CSS .fixed {     position: fixed;     top:0; left:0;     width: 100%; } .sticky-header {     width:700px;     height:50px;     background:orange;     postion:fixed; } JSS $(window).scroll(function(){     if ($(window).scrollTop() >= 330) {        $('.sticky-header').addClass('fixed');     }     else {        $('.sticky-header').removeClass('fixed');     } });

body { overflow:hidden; }

Most probably the file is just being cached by the server. You could either disable cache (but remember to enable it when the site goes live), or modify  href  of your  link  tag, so the server will not load it from cache. If your page is created dynamically by some language like php, you could add some variable at the end of the  href  value, like: rel="stylesheet" type="text/css" href="css/yourStyles.css? php echo time (); ?> " That will add the current timestamp on the end of a file path, so it will always be unique and never loaded from cache. If your page is static, you have to manage those variables yourself, so use something like: rel = "stylesheet" type = "text/css" href = "css/yourStyles.css?version=1" /> after doing some changes in the file content, change  version=1  to  version=2  and so