3-Column Preview Card

Community feedback

• 

  バレンタイン 😈•64,190

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  Unfortunately, your challenge is not complete since it is not responsive 😢, which is a requirement for this challenge; a media query will help. Here is a link to Google Developer’s site that will teach you how make it 100% responsive:

  https://web.dev/learn/design/

  • Do not forget ⚠️ to check your FEM report, to see what is incorrect and update your code with it right after you submit your challenge.

  • Along with the blank alt tag, you also want to include the aria-hidden=“true” ⚠️ to your “car images/icons” to fully remove them from assistive technology.

  More Info:📚

  https://www.w3.org/WAI/tutorials/images/

  • Your "buttons" were created with the incorrect element ❌. When the user clicks on the button they should be directed to a different part of you site. The anchor tag }will achieve this.

  More Info:📚

  MDN The Anchor element

  If you have any questions or need further clarification, feel free to reach out to me.

  Happy Coding! 🎆🎊🪅

  Marked as helpful

  0
• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  Replace<div class="container">with the main tag and <div class="attribution"> with the footer tag to fix the accessibility issues. click here for more on web-accessibility

  To center a content on a page, add min-height:100vh; display: flex; align-items: center: justify-content: center; or min-height:100vh; display: grid place-items: center to the body.

  Give the button a background-color of transparent, a font-color that is the same as the section color and font-weight of 700. what you gave the button is the hover effect of each button.

  Use relative units like rem and em as unit for the margin, padding width and font-size. For more on CSS unit click here

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  Marked as helpful

  0