[Support request] Generate inside page header content vertical center on Safari browser

Home Forums Support [Support request] Generate inside page header content vertical center on Safari browser

Home Forums Support Generate inside page header content vertical center on Safari browser

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #316507
    Nikola

    Hi Tom, i have a problem with a div element inside generate-inside-page-header-content on Safari browser for Mac.

    I want to be vertical center, on the bottom of page header, how it looks like on Chrome browser. In Internet Explorer is ok, but on Safari is aligned left to the page container.

    http://test.nikolakalinovic.com/

    How to center it like on Chrome? Thanks.

    Also on this page http://test.nikolakalinovic.com/zlatibor-apartmani/apartman-1/ if you look in Chrome wp booking calendar at the bottom of the page, it looks different in chrome, Safari and IE. I want to look like in Chrome.

    Thanks in advance.

    Best
    Nikola

    #316554
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    What version of Safari are you using? On Mac or Windows?

    On Windows, I am seeing the gap. This is caused by Safari not being updated for Windows anymore, so it doesn’t get any of the new cool CSS3 features like Flexbox etc..

    Most likely the same issue with the calendar – it depends on how it’s been coded by the developer.

    #316629
    Nikola

    Hi Tom,

    The problem persist on both, Windows and Mac. The website that i am developing target premium market and i assume that will be many Mac users, i need something to resolve this, i tried some things but nothing worked. :/

    Calendar has problems in IE and Safari.

    #316774
    Tom
    Lead Developer
    Lead Developer

    Can you show me a screenshot of the issue you’re seeing?

    #316821
    Nikola

    This is how header looklike in chrome, and how is planed to be.
    Chrome header

    This is how header looklike in Safari on Mac
    Safari header

    This is how calendar looklike in Chrome, and how is planer to be.
    Calendar Chrome

    This is how calendar looklike in Safari and IE
    Calendar Safari and IE

    #317068
    Tom
    Lead Developer
    Lead Developer

    Try replacing your current CSS with:

    .apartmani-header-slider-boxes {
        position: absolute;
        bottom: 0px;
        text-align: center;
        z-index: 999;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    I’m not really sure what’s up with the calendar – you might have to ask the plugin developer about that one.

    #317479
    Nikola

    Now is fine with safari. Thank you a lot. 🙂

    Just have to check what to do with that calendar. Can i put him somehow to the middle of column?
    That will be good.

    #317598
    Tom
    Lead Developer
    Lead Developer

    You could try this:

    #sbc-calendar-wrapper {
        margin-left: auto;
        margin-right: auto;
    }
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.