Four Card Feature Section Main using SASS

Community feedback

• 

  Abdul Khaliq 🚀•72,580

  @0xabdulkhaliqPosted 6 months ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have a suggestion regarding your code that I believe will be of great interest to you.

  ---

  DON'T USE MULTIPLE H1 HEADINGS :

  • Adding more than one h1 heading per page is not a good practice and it will causes severe accessibility issues.

  ---

  • Every site must want only one h1 element identifying and describing the main content of the page.

  ---

  • An h1 heading provides an important navigation point for users of assistive technologies, allowing them to easily find the main content of the page.

  ---

  • So we want to change the second h1 element delivery__title--powered into a h2 element or otherwise you could just add the content of that one into the h1 element and just wrap it using a span with the class of delivery__title--powered to style it.

  ---

  • Example:

  <h1 class="delivery__title">
      Reliable, efficient delivery
     <span class="delivery__title--powered">
          Powered by Technology
     </span>
  </h1>
  

  ---

  • Now you can easily style your heading without worrying on accessibility part.

  ---

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  Marked as helpful

  0
• 

  karthikganesanTR•130

  @karthikganesanTRPosted 6 months ago

  Congratulations on completing the challenge. I have one suggestion.

  You correctly used BEM classes in your HTML. In CSS, you no need to use descedant selectors .delivery .delivery__cards .delivery__card instead use delivery_card. This line defeats the purpose of using BEM And also styles always cascade in an element.

  0