Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Button transition bug fixing? I need your help team…

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #285441
    lydenyardley
    Participant

    Hey everyone,

    This one is puzzling! I’m testing a button transition and it’s doing different things across Chrome, Firefox, and Safari.

    Chrome = correct, intended animation. ::before element starts from a 45deg skew and no width, and on button hover, transforms to 0deg skew and full width (-3px margin). SMOOTH :)
    Safari = correct animation, but also producing a weird text jumping bug
    Firefox = correct animation, but producing a weird height jump (the ::after element is about 1px too tall during transition, only to resolve itself at the end of the transition)

    Is anybody familiar with these matters, up for the challenge?

    Website is https://yardley.me

    Thanks,
    Lyden

    #285504
    Paulie_D
    Member

    A Codepen.io demo would be preferable to a separate link.

    Saves us having to tinker with unrelated code in Developer Tools.

    #285508
    lydenyardley
    Participant
    #285518
    Shikkediel
    Participant

    Looks perfectly fine to me on Firefox (W7).

    #285526
    lydenyardley
    Participant

    Oh… well that’s good to know. I’m on a Mac, so haven’t been able to test that.

    Anybody else see the issues I’ve described?

    #285583
    lydenyardley
    Participant

    Anybody got a few minutes to look at this for me? I’ll owe you one!

    #285892
    lydenyardley
    Participant

    I’d still love some support on this. I think it might be something simple that I’ve missed…

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