Home › Forums › Calendar Products › Filter Bar › Vertical Filter Bar Opens at 100% Width on Desktop
- This topic has 9 replies, 5 voices, and was last updated 7 years, 4 months ago by Dan Feeley.
-
AuthorPosts
-
November 4, 2016 at 11:24 am #1187860Dan FeeleyParticipant
I appear to be having the same issue as a few other people which still exists with the 4.3.2 release.
When open the vertical filter bar is at full width and you no longer see the event list on the desktop. I disabled all plugins except The Events Calendar and the Events Calendar Filter Bar. I am also running the Twenty Sixteen theme with no modifications.
Here’s a screen recording of what I am seeing: http://recordit.co/bjTeBid71w
November 4, 2016 at 5:07 pm #1188030NicoMemberHi Dan,
Thanks for reaching out and sorry to hear about this issue 🙁
It appears to be introduced in 4.3.1, it was logged when 4.3.2 was scoped and due to time constrains devs couldn’t slip that in. Good news is it should get fixed in 4.3.3 coming out in less than two weeks time (if everything goes as planned).
This CSS snippet worked for users reporting this:
.tribe-events-filters-vertical {
float: left;
width: 25%;
}
Please give the fix a try and let me know if it works for you,
Best,
NicoNovember 7, 2016 at 2:26 am #1188515Dan FeeleyParticipantHello Nico, thanks for the fix.
it appears to be working.November 7, 2016 at 9:38 am #1188692NicoMemberGlad it helps Dan! Thanks for the heads-up 🙂
November 11, 2016 at 9:04 am #1191023MistyParticipantThanks for the start! In my install, the rule suggested in this thread caused some vertical alignment issues, and setting the top margin was being partially overwritten by rules in filter-view.css. To apply the top margin, the options were to use !important on the 75px, or to add more specificity to the rule (better option – code follows)
#tribe_events_filters_wrapper.tribe-events-filters-vertical { width: 25%; float: left; margin-top: 75px; }
Additionally, in the collapsed mobile layout, the “Show Filters” button was being obscured by the event list, because the wrapper was given an explicit height of 0 in the filter-view.css. To restore its place in the visual layout, I added this rule (had to use !important this time…) :
@media only screen and (max-width: 767px) { #tribe_events_filters_wrapper.tribe-events-filters-horizontal, .tribe-filters-closed #tribe_events_filters_wrapper.tribe-events-filters-horizontal, .tribe-filters-closed #tribe_events_filters_wrapper.tribe-events-filters-vertical { height: auto !important; } }
November 11, 2016 at 10:41 am #1191075NicoMemberHey Misty,
Thanks for chiming in and for adding your fix 🙂
Hopefully next maintenance release 4.3.3 coming out next week will fix this!
Cheers,
NicoNovember 16, 2016 at 5:53 pm #1193631GeorgeParticipantHello!
I wanted to inform you that we’ve just published a series of updates to our products that fixes a number of issues.
We’ve fixed the Filter Bar layout issues reported here.
Learn more about this release—version 4.3.3—in the official release notes here → https://theeventscalendar.com/maintenance-release-events-calendar-4-3-3-event-tickets-4-3-3-premium-plugins/
Thanks for your patience while we fixed this!
GeorgeNovember 20, 2016 at 1:29 pm #1195126Dan FeeleyParticipantSorry Nico,
Meant to come back and say the temp fix worked.
But the updated plugin appears to be working too.Thanks
November 21, 2016 at 8:16 am #1195338NicoMemberThanks so much for confirming Dan 🙂
As this is solved now by the plugin update I’ll go ahead and close out this thread, but if you need help with anything else please don’t hesitate to create a new one and we will be happy to assist you.
Best,
Nico -
AuthorPosts
- The topic ‘Vertical Filter Bar Opens at 100% Width on Desktop’ is closed to new replies.