Order Summary

Community feedback

• 

  Krzysztof Rozbicki•370

  @KrzysztofRozbickiPosted almost 2 years ago

  Hey. I would have for you only one advice for responsive design because now yours is not responsive and looks cropped with viewport width lower than 500px.

  First of all consider if you need to use width property. If so instead of width: try to use max-width: more often which makes it more responsive.

  Secondly - when you will put a class to your photo and add it : width:100% it will automatically retain the width of its container even on smaller screens.

  And lastly but not leastly: With container like wrappers / mains etc consider using min() property e.g. width: min(87.5vw, 450px) - it will set your container width either to 450px or to 87.5% width of the screen - will choose the value that is lower.
  It is very useful when building the responsive designs. More here: https://developer.mozilla.org/en-US/docs/Web/CSS/min

  This is only one way to make it adaptive/responsive - you can reach the goal in different methdos. responsive designis quite a big topic not possible to put it all in this short comment. But i recommend you read more - testing it and simply have fun with the designs. The mobile-first must have right now. Overall you did a very good Job! And have fun!

  Marked as helpful

  1

  ---

  

  Carolina S.•80

  @miporinsPosted almost 2 years ago

  @KrzysztofRozbicki Thanks for the heads up! Indeed, I should be more careful about the responsive part, I will definitely read and search more about it to add in next projects. Thanks for all tips!

  0