Need help with twenty-twenty-four I am at my LIMIT
I’m having a strange issue with the WordPress Site Editor / block theme header.
My header looks significantly taller inside the Site Editor than it does on the actual frontend of the website. The spacing also seems inconsistent between the header template part, the full template preview, and the live page.
My header structure is roughly:
- Columns block
- Column 1: menu button
- Column 2: site logo
- Column 3: Group
- Cover block used as a circular “Book a Table” element
I already checked or changed the following:
- Header margin: 0
- Header padding: 0
- Cover margin: 0
- Global block spacing: 0
- Minimum heights
- Cover aspect ratio
- Removed the main Cover/image below the header to make sure it was not creating the gap
The strange part is that the same header appears with noticeably different heights depending on where I view it:
- Header template part editor
- Full template editor
- Actual frontend
There also seems to be extra white space below the header contents even though I cannot find any margin or padding responsible for it.
Is this caused by the Columns block, the Header template-part wrapper, global styles, or some editor-specific CSS?
I would mainly like to know how to make the header height consistent between the Site Editor and the actual frontend, and ideally control its height reliably.
In the Pics you can see how It is in the editor and then how it looks live.
EDIT: Guys I figured It out thanks🥹 It was a padding thing. And it was hidden somewhere I could only find it when I was inspecting the element and I wouldnt figure it out because the live thing looked way different than the editor view. Seriously they gotta shut that down what the hell😫 Anyway thanks a lot!
[link] [comments]