❤️ flexbox, sass, responsive 😃

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  Hey, awesome work on this one. Layout in general looks great.

  Also, awesome that you are managing using flexbox!

  Some suggestions would be:

  • Always have a main element to wrap the main content of your site. On this one, the .flex selector could have used main element instead of section.
  • Avoid using height: 100vh on a large container. This makes the element's height limited to the remaining viewport/screen's height. On your .flex selector, replace it with min-height: 100vh this takes full height but allows the element to expand if it needs to.
  • The small circles img should be using alt="' and add an extra aria-hidden="true" attribute on the img tag. An image that is just use for decoration must be always hidden at all times using the above method.
  • Also, when using alt avoid using words that relates to "graphic" such as "background, icon, image..." img is already a graphic so no need to describe it as one.
  • alt for the person's image should be their name like alt="Victor Crest", a person's image is meaningful in this kind of components.
  • The .card-body-footer could have use ul element, since those are "list" of information about the user.
  • The bold text in that section should not be a heading tag, since by making it one, it does not really give insight about the section right, what does 80k means, it is better to be p tag. Also, not every elements that are highlighted in design are heading tags.

  Aside from those, great work again on this one.

  Marked as helpful

  2

  ---

  

  Ramy Campusano Volquez•340

  @Daniels-notPosted about 3 years ago

  @pikamart I really appreciate your help. Thank you. 😊

  0