Modern Events Calendar ::: sidebar below content, content shifting left

Please check this video:

URL: http://toastmasters.be/leuven/events/regular-meeting-2022082511/

→ How do we stop the content from shifting like that?
= How do we have the sidebar on the side when the page loads?


Topics that do not solve this:

Hey @tblaye,

Thanks for reaching out!

I check the page and found out that you added a custom CSS code that makes the sidebar below the content in the first load. This is what I am referring to:

Please remove this CSS code in your X > Theme Options > CSS.

body.x-navbar-fixed-top-active .x-navbar-wrap {
    height: 0px;
}

Hope that helps.

Hi @marc_a

When approaching this top-down by inspecting the element in the browser, you see that’s indeed the parameter that is causing this glitch.

Bottom-up, however, I have not specified that parameter anywhere in my custom CSS code, so I can’t remove it manually — or don’t know how.

So the question isn’t what to remove to fix it, but what I have to add…

Hello @tblaye,

Please have your custom CSS updated and use this instead:

body.x-navbar-fixed-top-active:not(.single-mec-events) .x-navbar-wrap {
    height: 0px;
}

This code will only affect any other single page that is NOT an MEC event single page.

The code above serves as an example code. Feel free to modify it when needed. Please note that custom coding is beyond the scope of our support. You will have to maintain any custom coding to make sure that it will still work after any updates or does not create any issues or incompatibility in the future.

Best Regards.

I tried adding this CSS code.

It did not fix the issue.

Hello @tblaye,

When visiting the page, I am now seeing this:

It seems that you have removed the CSS code instead which I think that resolves your issue. Kindly let us know.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.