Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1235777

    Hello,
    I am having an issue with an icon overlay in a header. The four dots should be offset to the right as seen here https://dev9.curlyhost.com/ . On the mobile version, in Safari only, they are centered directly under the circle. Is there a way to target only the safari browser with CSS to push it over? I have tried this so far, but it is not working.
    @media only screen and (max-width: 767px){
    _::-webkit-full-page-media, _:future, :root .safari_only .headericon {
    left: 30% !important;
    }
    }

    Let me know if you need more clarification! Thanks!

    #1235953

    Hey Andrea,

    I’m not sure exactly what you need to adjust on Safari, could you post a screenshot highlighting the changes you would like to make please? If you want to target Safari only then you can use this class before your CSS:

    .avia-safari

    Best regards,
    Rikard

    #1236040

    This worked. Thanks!
    @media only screen and (max-width: 767px){
    .avia-safari .headericon {
    left: 30% !important;
    }
    }

    #1236106

    Hi CurlyHost,

    Glad you got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

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