Results Summary Solution

Community feedback

• 

  MoggStephen•160

  @MoggStephenPosted over 1 year ago

  Hello there!

  You've matched the desktop design really well!

  To get your mobile design to work you need to set up a media query at about 550px. Change the containers flex-direction to column and the width to 100%. Then you need to change your box and summary classes to width 100% too.

  Initially if you want a responsive design you can set the containers width to 100% and max-width to the widths in the design. Then set your box and summary widths to 50%.

  The method you used to center the container i think is fine for small components like this, however for any larger challenges you should not be using this. It can add a flicker effect to the page as it loads in larger projects.

  You might also want to start using rem units instead of px. This video is passed around a lot with people who are new to choosing the right units for certain things, so I thought id link it! https://www.youtube.com/watch?v=N5wpD9Ov_To

  Happy coding!

  Marked as helpful

  0
• 

  Mário Vergara•160

  @mvergara94Posted over 1 year ago

  Nice Job! I think if you use the propertie flex-wrap: wrap; in your flex container it's a start. I take a look only in the developer tool and add it there, of course there another behaviours to treat but it's a start. Hope it would help.

  Marked as helpful

  0