Base Apparel Page Using CSS Grid & Flexbox

Community feedback

• 

  Roman Filenko•3,335

  @rfilenkoPosted over 4 years ago

  Hey, there are some issues with layout and overflow - use mediaqueries to overwrite styles on different breakpoints. Usually mobile-first approach results in less code. Pay attention to change values of grid or flex, margin, paddings, etc on smaller viewports. Also don't use so man selectors - just one class is enough.

  Cheers, Roman

  2

  ---

  

  Rowland•185

  @RowkibetPosted over 4 years ago

  @rfilenko Thanks for the feedback, I will try the mobile-first approach and fix the other issues you pointed out.

  0
• 

  SathishVM•280

  @SathishVMPosted over 4 years ago

  Hello Rowland,

  Yeah, rfilenko is right. use some media queries and don't use selectors and in the form input using flexbox will be more head pain when it comes to specifically for this solution and try reducing font-size by 1 or 2 px when it gets to mobile screen.

  If you get problems again feel free to view my solution

  https://github.com/sathishvm/Frontend-Mentor-Challenges/tree/master/base-apparel-coming-soon

  1

  ---

  

  Rowland•185

  @RowkibetPosted over 4 years ago

  @sathishvm thanks for helping me out and providing the link to your solution. I have started adding the media queries to my solution but I am not yet done.

  For the selectors, did you mean I should reduce the number of selectors i have written when targetting an element in the css file?

  0

  

  SathishVM•280

  @SathishVMPosted over 4 years ago

  @Rowkibet yes Rowkibet when you using the selectors use them when you have a unique CSS declaration which means it shouldn't affect anything else and writing css for each element to design will help you when you add the media queries to it. ✌️. So that's why I too suggested using less selectors in the code

  0