HTML SASS and Flexbox

Community feedback

• 

  T

  Grace•31,270

  @grace-snowPosted over 3 years ago

  Hi @Maryehb

  The background circles are positioned fine and the card looks pretty good (I'm viewing on mobile)

  But there are some big issues, mainly with the html, on this. I hope these suggestions help you:

  • there's no html semantics at all. You need to use meaningful elements, text can't be in divs alone. Really think about what would make sense for this document
  • alt attributes on decorative/meaningless images like the background circles need to be left blank. If they are svgs they also need aria-hidden true
  • alt attribute on the persons picture needs to be his name. Describe what the picture is of
  • more of a question this one... Why is almost everything in the css a flex column? There is no need for so many flex columns especially when block elements will stack by default anyway. Nesting flex deeply can lead to unpredicable results as well as bloated css.
  • make sure you keep small details from the design like the card shadow

  0

  ---

  

  Mariem Ehab•335

  @MaryEhbPosted over 3 years ago

  @grace-snow thank you so much for this precious comments on my code. I will go back and apply them to the code 🤩🥰 I don't know why I used many flex columns 😂 but I am going to try to fix that But I want to understand more about the alt attribute and how and when to describe it's image properly ?!!

  0