Stats preview card component challenge hub

Community feedback

• 

  T

  Mike Hayden•1,005

  @mickygingerPosted about 3 years ago

  Hey David,

  This looks great on desktop, but as you alluded to above the mobile layout is a little off.

  You've added a couple of empty divs, presumably for layout purposes? We shouldn't really be adding unnecessary markup, padding and margin (or gap in the case of grid) should be sufficient.

  You're using grid which is great, but perhaps flexbox would be a better idea here. If you aim to do the mobile layout first you can set flex-direction: column so that the image sits above the content, then change to flex-direction: row-reverse on desktop so that the image sits to the right of the content.

  Here's a really useful guide to flexbox from CSS-Tricks, hopefully you'll find it helpful 😀

  0

  ---

  

  David Kalany•50

  @AmazingCukrPosted about 3 years ago

  @mickyginger I've added emty difs for grid purposes to make space between. Im learning html&css tops 3 weeks. There is definitely better way how to make but this was the one, that i could think of. So every help is much appreciated :)

  0