Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Mobile-first with animations

P
Emmilie Estabilloā€¢ 5,540

@emestabillo

Desktop design screenshot for the Fylo data storage component coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

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?

Community feedback

Martinā€¢ 1,150

@ringm

Posted

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!

2

P
Emmilie Estabilloā€¢ 5,540

@emestabillo

Posted

@ringm Awesome! Thank you for the advice will keep it in mind šŸ™‚

0
Cara Uymatiaoā€¢ 75

@carauymatiao

Posted

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.

1

P
Emmilie Estabilloā€¢ 5,540

@emestabillo

Posted

@carauymatiao Great observation Cara! I have to admit I did not account for mobile landscape. Thanks for the shoutout!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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