Sticky Header Issues (Focal Theme)

Topic summary

A store owner is experiencing two sticky header problems with the Focal theme:

Desktop Issue:

  • The sticky header overlaps page content on product pages (see attached screenshot)
  • Previously suggested CSS solutions (adding padding-top to .page-container) have not resolved the problem

Mobile Issue:

  • The header jumps randomly down the page while scrolling, then disappears
  • Visual examples provided via Imgur link

Additional Request:

  • Move the +/- quantity selector buttons onto the same line as the “Quantity” label (currently on separate lines)

Current Status:

  • Collaborator access has been shared with a helper (TheUntechnickle)
  • Store access request sent and awaiting acceptance
  • Both the header overlap and quantity button alignment issues will be addressed once theme access is granted
  • CSS adjustments planned to fix the layout problems
Summarized with AI on November 2. AI used: claude-sonnet-4-5-20250929.

Hi all,

We’re seeking some help to fix our sticky header in both desktop and mobile view as it is not behaving properly.

In desktop, on the product page, the header covers the top of the page content (please see image below):

We have tried several solutions from other threads on this forum such as below, but it hasn’t solved the issue

.page-container {
padding-top: 150px !important;
}

In mobile, as you scroll down the page, the header jumps randomly down the page, then disappears. Please see images here:

https://imgur.com/a/Ja56efl

Our affected page is: https://hairright.co.uk/products/dht-blocker-hair-loss-supplement?selling_plan=3387293934

Any help appreciated.

Thanks Shubham, I have just sent you the collaborator code to that email now.

As a separate question, on the same page is it possible to move the +/- quantity onto the same line as the “Quantity;” line?

Thanks for sending over the collaborator code, I’ve sent you the store access request, please accept it.

Regarding your question: Yes, it’s definitely possible to move the quantity buttons onto the same line as the “Quantity” label. I can update the layout using CSS adjustments to align those elements in one line. Once I have access to the theme, I’ll make this change for you.

1 Like