Skip to content
Submitted almost 5 years ago

Mobile-first with animations

Emmilie Estabillo•5,580
@emestabillo
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Fylo data storage component
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

Are keyframes usually placed at the end of the file or right under the target element? Is there a particular convention? Also, why is the preview behavior different from the live link?

Please log in to post a comment

Log in with GitHub

Community feedback

  • Martin•1,150
    @ringm

    Hi Emmilie, great job! Looks amazing, and you even did an animation, it looks fantastic!

    Regarding your question, I think what matters is that the @keyframes declarations are made before you actually call them. Probably it would be best putting them at the top, before main styles.

    Keep it up!

  • Cara Uymatiao•75
    @carauymatiao

    I used this solution as a study reference for mine. It is well done and clean!

    If it needs any adjustments, it's just for mobile in landscape mode. The attribution is floating over the button when on mobile - landscape mode.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord