Order Summary Component designed with CSS Grid and Flexbox

Community feedback

• 

  Devmor•470

  @devmor-jPosted over 2 years ago

  Nice! this is good and the job is done.

  If you're interested in other's opinion then I can make 2 suggestions:

  1️⃣ Maintaining two separate css files for Mobile and Desktop is a thing of past and is not recommended since Responsive design has become the standard in Web dev today. So eigher merge and keep all CSS in one file or at least make sure styles look great on Mobile design and only after that justify your styles to look nice on Desktop as well.

  2️⃣ Zoom out and make sure media queries don't break on smaller viewport. Right now this website does not look styled on my system (1080p screen).

  I think this media query is the reason:

  @media (min-width: 376px) and (max-width:1440px) {
      ...
  }
  

  Since your applying these rules only between 376px - 1440px so If someone load your site on a 4k monitor, these media query styles are not applied.

  Your HTML though looks nice and solid, well done and hope these help 😀

  Marked as helpful

  1

  ---

  

  mohammadsuliman•70

  @MB-SulimanPosted over 2 years ago

  @devmor-j Thank you very much

  1