Unchanged Header Margin and Misaligned Mission Statement

  • Unknown's avatar

    Why is my header not been changed I added the change of the margin not being there over a week ago, why hasnt it been changed and on my page weareypi.com/mission my mission statement is off center when its not supposed to be can someone tell me the issue with my site

    The blog I need help with is: (visible only to logged in users)

  • Hi there, I went to Appearance > Site Editor, where you would make template changes such as changing the header margins, and what I saw in the editor was identical to what we see on the site https://weareypi.com. Did you make the changes somewhere else? Or did you save/publish after making the changes? At the moment, what we see on the homepage is expected behavior, based on the setup in the Site Editor.

    As for https://weareypi.com/mission/ being off-center: the content is centered up to a certain monitor width. On an ultra-wide monitor, I can see where it is no longer centered. But in your Site Editor, you have set your content area’s maximum width at 620px and the overall maximum page width to 1440px. So the content isn’t able to center beyond that size.

    I recommend changing these dimensions to use percentages instead. For example, you could do a main content width of 70% and overall page width of 100%. That way the layout would adapt to all screen sizes. You can make this change at Appearance > Site Editor, and click on the half black half white circle at the top left. Then click Layout to find the dimensions you need to change. If you click on the little “px” text, that can be changed to % or any other form of measurement you choose.

  • Unknown's avatar

    Thank You So Much, but this helped me fix my issue on my end for the site editor on the alligment of the page that was fixed so thank you, however I cannot seem to get the margin of the header to replicate properly on my site currently as you know it looks like this on top with a 40px margin but in my templates it looks like as you see on the on the bottom with a small margin can how can i get that fixed?

  • According to the code, there is an element in the nav bar that is set to have a height of 100px. When you expand the nav bar pattern that you have, you’ll see many sub-blocks, such as columns, Navigation, etc, and the setting can be in any one of those.

    If you’re not sure which one has the setting, it may be fastest to delete the nav bar and then re-add it. That way it’ll be applied without size modifications, and you can adjust it from there as you see fit.

  • Unknown's avatar

    I have redone the nav bar with a new part and i still seem to have the same problem, I am just confused, do you think the spacing comes from some custom css I might have implemented that but thats weird that it doesn’t show in the editor but shows on the official site

  • If you created custom CSS, it would certainly have that effect. It can overwrite any styles set in the editor, and it is applied directly to the live site (you won’t see the effect of your custom CSS within the Site Editor).

  • Unknown's avatar

    How can I undo the custom CSS? I am also having an issue with a template not registering when I switch the page to that template.

  • Unknown's avatar

    Update I found where the custom CSS was orginally and I had only changed the background of the block and I did nothing to the template part, I did at one point but I got rid of it but it still remains (the extra 100px of height) can someone help me fix it

  • I investigated the code of the Navigation block section and found that you have added Spacer blocks with a width of 40px and height of 100px in between the menu items. Here’s a screenshot: https://d.pr/i/OHwtxV

    That spacer block is responsible for the extra 100px height.

    Please delete those Spacer blocks by going to Appearance > Editor > click Edit Orginal on Nav Bar reusable block. To add space between navigation menu items, you can adjust Block spacing on the parent Navigation block.

    You may refer to this screen recording: https://d.pr/v/wEzOEJ

  • Unknown's avatar

    Thank You Very Much That Fixed It

  • You’re welcome!

    I am closing this thread now. Should you have any other questions, please feel free to contact us.

  • The topic ‘Unchanged Header Margin and Misaligned Mission Statement’ is closed to new replies.