Calendar display is wonky

  • This topic has 10 replies, 4 voices, and was last updated 3 years ago by Graham Strong.
Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #792427
    Vernon Song
    Participant

    Hi there,

    When using the shortcode:
    [mphb_availability_calendar id=”5469″ monthstoshow=”2″]

    it displays like this:

    http://prntscr.com/n9cetp

    How do I fix it so that the months are aligned, and the year is more subtle?
    i.e. the calendars are on the same horizontal line?

    #793117
    J. Davis
    Keymaster

    Hi Vernon,

    You may try to apply the style below at Appearance > Customize> Additional CSS (or style.css file if you use a Child Theme):

    .mphb-calendar .datepick-month-year{
        width:48%;
    }

    best regards,
    J. Davis

    #793402
    Vernon Song
    Participant

    Thanks,

    Have implemented the css but it changes nothing.

    You can view the implementation here:

    http://workphlow.com.au/asg/caltest

    Anymore suggestions?

    #793920
    J. Davis
    Keymaster

    Hi Vernon,

    Thank you for provided example. It required more styles:

    .mphb-calendar .datepick-month-year {
        min-width: 50% !important;
        padding: 0 !important;
        float: left;
    }

    best regards,
    J. Davis

    #794123
    Chrissy Raudonis
    Participant

    I’ve got the same issue. I added the css and it fixed it in Chrome but now it looks worse in Firefox:

    Firefox Cal

    #796053
    J. Davis
    Keymaster

    Hi Chrissy,

    Could you provide a link where we can test the issue?
    You can also try to clear the cache in your firefox browser and check it again.

    best regards,
    J. Davis

    #796201
    Chrissy Raudonis
    Participant

    Clearing the cache doesn’t do it:

    Camp Hatteras

    Click “Book Now” or scroll to bottom. It’s an issue in both Edge and Firefox on my computer, unless I zoom out.

    #796579
    J. Davis
    Keymaster

    Hi Chrissy,

    I’ve checked your site and calendars look properly either in firefox and chrome browsers. I’d just recommend to add some padding for datepick-month-year class.

    best regards,
    J. Davis

    #796683
    Chrissy Raudonis
    Participant

    I ended up doing a 2 x 2 cal. and that solved the issue on my screen. I’m guessing it had to do with aspect ratio. You’re right – it did look better with padding. Thanks!

    #797441
    Vernon Song
    Participant

    Awesome, that worked – Thanks!

    #807759
    Graham Strong
    Participant

    Hi — I’m having the same issues. I’ve tried the same fixes as mentioned above and tried different settings for the padding, but nothing seems to work. Here is the page:

    The Beachcomber – OC Condo

    Any insights you could provide would be greatly appreciated!

    Thanks!

    ~Graham

Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.