Making a page header stick | XM Community
Skip to main content

Hi Brains Trust. I’m trying to make my page header stick so that it doesn’t scroll up with my questions (I have 8 questions that need to stay on the same page). I’ve a feeling it can be done in Look and Feel by using some custom CSS in the Header field. Does anyone know the code? I have no programming experience or knowledge whatsoever!

Thanks

Hi ​@KazJPat ,

You can try with below code adding in Look and Feel > General > Header section source:

<div style="text-align: center;">Type your header text...
<style type="text/css">/* Make the header sticky */
#Header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999; /* Keep it above everything else */
  padding: 10px 0;
}

/* Add top spacing to prevent content from hiding behind the sticky header. */
#SkinInner {
  margin-top: 80px; /* Adjust this depending on your header height */
}
</style>
</div>

Hope it helps for you.


 

Leave a Reply


Terms & Conditions