Calendar behind navigation…

[Sanne]

Hi,

When visitors want to fill in a specific date, the little calender show behind the navigation. What can i do to make the calender go down instead of up?

Thanks in advance,
Sanne

[Brook]

Howdy Saane,

I would love to assist here.

Basically your menu system, which possibly comes from your theme, is using some CSS to make sure it always appears on top. It is very effective, and so it appears over top the datepicker.

There would be two options to fix this:

1. Correct the CSS within your theme to not always appear on top. Specifically .menu-panel-wrapper should not specify it’s position and .menu-panel should be a z-index of 9 or less. You might need to contact the theme author if you are unfamiliar with modifying CSS.
2. Or you can add some padding for the datepicker with the following CSS. This will add more padding between the calendar and the menu, so that the datepicker can popup and still be visible.

div#tribe-events-content-wrapper { margin-top: 135px; }

Does that all make sense? Will one of those work for you?

Cheers!

– Brook

[Sanne]

Hi,
Thank you very much! Your css works, but new css from theme builder makes more sense. Thanks!
Sanne

[Brook]

Excellent! I am happy they provided you with a better solution. I tried a few things but my unfamiliarity with their code was making it extremely difficult to find some good CSS for their theme, and so I just shared something that would only modify our plugin.

Please let us know if you ever need anything else.

Cheers!

– Brook

[Author]

Posts