Skip to content
Submitted over 2 years ago

Responsive data storage component

Nader•300
@youtubbeh
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

I tried to make it so the content on the right side reduced its width progressively instead of changing abruptly, but couldn't do it. I tried all sorts of width and max-width values, as well as flex-shrink.

If you have any advice on how to do it, I'd be very thankful!

Community feedback

  • Gloryjaw•320
    @GloryjawPosted over 2 years ago

    Hii, nice work on the challenge. It looks awesome.The few things you can do to make it look like the original design is -->

    1. You should use width in percentages instead of px to make change in widths progressively. Using width in percentage will adjust the width relative to its parent. So,width:75% means 75% of the parent width.

    2. Border radius of the GB left popup in desktop screen is little more than it should be, reduce it.

    3. Try to make your html code a little semantic.(using section, buttons tags instead of div).

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

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