3 column preview card using flexbox

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

• The “car icons” in this component are purely decorative. ⚠️ Their alt tag should be left blank and have an aria-hidden=“true” to hide them from assistive technology.

More Info:📚

[MDN Aria-Hidden] (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden#description)

• 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

• For improved accessibility 📈 for your content, it is best practice to use em for media-queries. Using this unit gives users the ability to scale elements up and down, relative to a set value.

• Implement a "Mobile First" approach 📱 > 🖥

Mobile devices are now the dominant 👑 way in which people browse the web, it is critical that your website/content looks perfect on all mobile devices.

More Info: 📚

Mobile First

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

Happy Coding! 🎆🎊🪅

Hello there 👋. Good job on completing the challenge !

In these types of challenges, it is not recommended to set overflow: hidden: in the body element, because it may prevent you from scrolling on mobile devices. The scroll appears due to the large margin it uses in the main element: margin: 5rem 0; Reduce it and you could remove the scroll,

Happy coding!

Hello, great job on completing the project.

Considering the fact your question about centering has already been answered and marked as helpful, I will not be addressing that here.

Although, I would like to highlight a small way to improve the user experience(UX) of your website. When your buttons are hovered over, consider using a transition of ease-in-out to make the color change appear smoother

HELLO......congrats on completing this challenge....well done:🎊 🎊

Based on your question , it's because you set a min-height on it. So your content must have had margins or paddings that will make the body add more height to itself(min-height). So you can simple just set body{overflow:hidden}

Hope this comment was helpful ,have fun coding