CSS bug help!

[greenbeeweb]

Hi there! I updated my homepage (https://shegeeksout.com/), added a new fancy pretty box to highlight some text, made some nice css buttons, and now if the screen is really wide, the box doesn’t stay in the center, and then weirdly jumps around when I scroll. On top of this, my blog posts are jumping too, the sidebar is at the bottom when it loads, then it jumps back to the top on scroll (https://shegeeksout.com/get-to-know-the-sgo-facilitators-felicia-jadczak/). Any help would be SO appreciated, I tried disabling all plugins and undoing my css, but no joy!

[marc_a]

Hi Rachel,

Thanks for reaching out.

The reason why your fancy box is not centered on the wider screen is because of the height you set in your header, the header height should be set to auto. To do that, go to X > Theme Options > Header > Navbar and set the navbar top height to empty. This will also fix the weirdly jump around when you scroll.

Hope that helps.

Thank you.

[greenbeeweb]

Ahhh YES that fixed it amazing THANK YOU! Now the subnav is all weird, is there another setting you could point me to, or perhaps past me made some css change? Thanks you’re a lifesaver!

[prakash_s]

Hi Rachel,

Please add this code in the X/Pro --->Theme Option -->CSS to align the sub-menu.

@media(min-width:980px){
.masthead-inline .x-navbar .desktop .sub-menu {
    top: 94px;
}
}

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Hope it helps you.
Thanks

[greenbeeweb]

You are a dream, thanks team!

[marc_a]

Hi Rachel,

You’re welcome and it’s our pleasure to help you. If you have any other concerns, feel free to reach us.

Thank you.