Search bar messed up with shortcode

[Joe]

Hello. I have a calendar view page http://racebase.net/events-calendar/ and the search bar is all out of alignment, but on the main page it’s fine http://racebase.net/events/ Any ideas?

Thank you

[Geoff]

Hi Joe,

Oh yeah, I see exactly what you mean. That looks like a classic case where the theme styles conflict with the plugin styles.

Try pasting this snippet to your theme’s style.css file or on the Appearance > Customize > Additional CSS screen:

.tribe-bar-geoloc-filter {
padding: 15px 15px !important;
}

.tribe-bar-views-inner {
  padding: 45px 0 45px !important;
}

Here’s a screenshot of how that looked when I tested it on your site. Does it work for you as well? Please let me know. 🙂

Cheers!
Geoff

[Joe]

Hi Geoff, cheers for your help. Unfortunately, although that code fixed it perfectly, it then caused the bar on the home page to mess up completely haha (attached)!

[Geoff]

Oh no! Dang, I had a hunch that might happen but had my fingers crossed. 🙂

Give this a try instead — it looks for a the body class of the specific page to limit the scope of where the styles are applied:

.page-template-default .tribe-bar-geoloc-filter {
padding: 15px 15px !important;
}

.page-template-default .tribe-bar-views-inner {
padding: 45px 0 45px !important;
}

Hopefully that does the trick!

Geoff

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts