Safari transition problem

[nejcm]

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

HTML:

Read more…

CSS:

.readMore_{
display:inline-block;
-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;
-webkit-perspective:1000;
}
.readMore:hover .readMore_{
background-color:#0b83aa;
padding-right:22px;
}

Here is the picture of the problem:
[http://s21.postimg.org/8afp9rxvr/transition.png](http://s21.postimg.org/8afp9rxvr/transition.png “Picture”)

Thanks for the help!

[nejcm]

:)

[Paulie_D]

Is this solved?

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

…and there is no such setting as

position:inline-block;

[nejcm]

Sorry my mistake. I will post the whole CSS. I meant display :) I made a code pen.
http://cdpn.io/fAbuc

[nejcm]

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.

[Author]

Posts