The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Safari transition problem

  • # May 8, 2013 at 7:21 pm

    Hello. I came across a problem in Safari. In every other browser it works fine but Safari has a problem. I’m using transitions on an arrow. Here is the html and part of CSS. I’m changing the padding-right on hover



    -webkit-transition:padding 0.08s ease-in-out;
    -moz-transition:padding 0.08s ease-in-out;
    -ms-transition:padding 0.08s ease-in-out;
    -o-transition:padding 0.08s ease-in-out;
    transition:padding 0.08s ease-in-out;
    -webkit-backface-visibility: hidden;
    .readMore:hover .readMore_{

    Here is the picture of the problem:
    []( “Picture”)

    Thanks for the help!

    # May 8, 2013 at 7:21 pm


    # May 9, 2013 at 5:16 am

    Is this solved?

    Also, there is not enough CSS there for us to created a Codepen.

    …and there is no such setting as


    # May 9, 2013 at 4:13 pm

    Sorry my mistake. I will post the whole CSS. I meant display :) I made a code pen.

    # May 9, 2013 at 10:00 pm

    I see now that the codepen one works OK in safari. So it has to be the problem in one of the inherited styles. I’ll check.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed