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

Responsive component using FlexBox and media queries.

@diogohrq

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


Any feedback is welcome.

Community feedback

Adriano 34,090

@AdrianoEscarabote

Posted

Hi Diogo Henrique, how are you?

I really liked the result of your project, but I have some tips that I think you will enjoy:

To prevent the background image from breaking at higher resolutions, we can do this:

  • Add a background-size: 100% 50vmin;, the 50vmin will set its height as the page target, and 100% will make it stretch on the horizontal axis.

The rest is great!

I hope it helps... 👍

Marked as helpful

1

@diogohrq

Posted

@AdrianoEscarabote Thank you so much for the tip!

1

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