Since you are setting that element with position:fixed
the space that was fill by the element is now available and the next container just switch up. To fix that you can correct the space with margin-top
:
$(window).scroll(function () {
if ($(window).scrollTop() > stickyHeaderTop) {
$('#stickyheader').css({
position: 'fixed',
top: '0px'
});
$('#stickyalias').css('display', 'block');
var mT = $('#stickyheader').css('height'); /*Add this*/
$('#stickyheader').next('.post').css('marginTop', mT); /*Add this*/
}else{
$('#stickyheader').css({
position: 'relative'
});
$('#stickyheader').next('.post').css('marginTop', '0'); /*Add this*/
}
});
Check this Working Demo