WordPress.org

Support

Support » Plugins and Hacks » WP FullCalendar » Table row heights are unusually large….

Table row heights are unusually large….

Viewing 6 replies - 1 through 6 (of 6 total)
  • I’m having this same issue. In Chrome the demo looks good but installed on my site I have those same long table cells for any day that has a post in it…

    It’s actually in Safari as well. Firefox works well though.

    Maybe it’s some kind of jQuery error… I suspected something w/ JetPack, deactivated it, but still no luck.
    Here’s the plugins I’m currently using on the same site:
    Advanced Responsive Video Embedder
    Akismet
    bbPress
    BuddyPress
    Delete Custom Fields
    Jetpack by WordPress.com
    Regenerate Thumbnails
    Standard Sticky Footer
    WordPress Importer
    WP FullCalendar

    What other plugins are you using?

    The plug-ins that I’m using are:
    Akismet
    Events Manager
    Jetpack
    Regenerate Thumbails
    Simply Youtube
    Stop Spammer Registrations
    Wordpress Backup to Dropbox
    Wordpress SEO
    WP Fullcalendar

    Until something is figured out, I’m probably going to use another events calendar plugin.

    I have having a similar issue. From the limited debugging I’ve done without the main.js source, I see an unusually large “height” style being applied to the first div in the first day of each week when that week contains events. The more events in that week, the larger the height (roughly double?)

    The offending element is this:

    #wpfc-calendar .fc-first .fc-day-content > div

    Unfortunately, the miscalculation of height also seems to affect where the absolutely-positioned events are placed, so a simple CSS hack won’t do the trick.

    Author, help!

    Figured it out. In my case the problem was with CSS transitions.

    The calendar JS resizes the rows for each week based upon how many events exist in that week. Long story short, my dumb CSS transitions were causing the event anchor tags to be very tall (1 character per new line), then transitioned into the approprite size. Before the transition occured, FullCalendar did its positioning and resizing calculations.

    Since my event tags were very tall at the time of calculations, it threw everything off.

    To fix, turn off CSS transitions within FullCalendar / for event calendar event A tags.

    Thank you @incredimike!

    Great catch! If you watch when the page loads, you’ll see the events really long for a split second (one character per line like you said) and then transition up how ever fast you have the transitions set.

    In this case I had all my anchor tags set to transition at 0.3s, so I added this to fix:

    a.fc-event {
    	-webkit-transition: none;
    	-moz-transition: none;
    	-o-transition: none;
    	-ms-transition: none;
    	transition: none;
    }

    Now it loads just fine.

    How do you turn off CSS transitions?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Table row heights are unusually large….’ is closed to new replies.
Skip to toolbar