3-column preview card component using HTML and SCSS

Community feedback

• 

  Cristina•360

  @cr1deg0Posted over 3 years ago

  Hi Huda, looks very good! A few things you may want to revisit to make it even better:

  • the Learn More button for the Luxury cars is a bit off compared with the other two.
  • have a look into the accessibility issues in the report.
  • you could round the corners of the card with border-radius: 12px;
  • the background colour is more greyish in the design.

  Cheers, Cristina

  Marked as helpful

  0

  ---

  

  Huda Rashid•160

  @hudarashidPosted over 3 years ago

  @cr1deg0 Hi Cristina, thanks for pointing out at my mistake! I struggling at finding out the issue. However, i still unsure what to do with some accessibility issue in the report which is :

  • how to put the main 'landmark'
  • tried to put landmarks on page content but getting more accessibility error
  • unsure how to adjust my page heading.

  Thanks in advance for helping ! -huda-

  0

  

  Cristina•360

  @cr1deg0Posted over 3 years ago

  @kopisatu Hi Huda,

  You can try using h1 or h2 for the car types (Sedans, SUV, Luxury). This may fix both your accessibility issues. I used h2 for my solution.

  I'm not sure about the 'main' landmark one as I've never experience this before, but you may want to look here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Main_role

  Sorry I cannot be of more help, still learning myself!! Regards, Cristina

  0

  

  Huda Rashid•160

  @hudarashidPosted over 3 years ago

  @cr1deg0 Thanks Cristina! I will look into it. All the best and keep going in learning! Regards, Huda :)

  0