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

Fylo data storage component

Felix 550

@Felix221123

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


I learnt that webkits extension used to style the meter element is not support on safari , chrome etc so i used different approach to make a new meter bar which worked perfectly : ) And also the use of grids was useful as always, it's becoming a everyday habit to use grids lol

Community feedback

@Tiuty00

Posted

Ehy felix, nice code! It's works everything fine! I like so much the Hover effect on the <a> in the attribution! Nice job! ;) One tip that I can give you is to add the "Height" value on your css code in "main", like this:

main {
display: flex;
place-content: center;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
}

In this way your page will be center in the middle of the screen!

And like plus, if you like Animations check out my code about this challenge! I just found these animations (fade in of the page and animation about progress bar) here in the page of the solutions in frontend mentor. I hope they help you! ;) Link to my solution

Again good job and continue programming! Have a nice day! :)

0

Felix 550

@Felix221123

Posted

Heyyyy thank you very much man,I really appreciate it And also I had a look at your solution and it was really cool,I think I will steal your idea : ) hehehe@Tiuty00

1

@Tiuty00

Posted

@Felix221123 eheh Steal it! ;) I'm Glad to have been helpful to you!

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