3 column preview card using Flexbox

Community feedback

• 

  Elaine•11,400

  @elaineleungPosted about 2 years ago

  Great work Deborah! This looks really good, and I think the responsiveness is quite well done. I just got two suggestions:

  1. At around the 660px breakpoint when the layout changes, the sides of the component are touching the sides of the browser, so I'd probably just add some spacing to keep that from happening (maybe margin: 1rem would be good enough!)

  2. Your report is giving you some issues about missing alt tags, and actually even for decorative images, you still need the alt tag in the img, but you can keep it empty, like this: <img scr="image.png" alt="" >

  Once again, well done here, and I'm glad you got improve upon your old solution!

  Marked as helpful

  1

  ---

  

  Deborah Robbiano•600

  @debriksPosted about 2 years ago

  @elaineleung Hi Elaine! Thank you to have taken the time to give me some feedback! I'm going to correct the code following your comments!

  0
• 

  Divine Obeten•2,415

  @Deevyn9Posted about 2 years ago

  Hi Deborah, congrats on completing this project, the buttons aren’t displaying on mobile, 375px width using safari.

  Hope you find the solution soon.

  Good luck

  Marked as helpful

  1

  ---

  

  Deborah Robbiano•600

  @debriksPosted about 2 years ago

  @Deevyn9 Hi Divine! I'll look into it! Thank you for your feedback!

  0
• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hi Deborah Robbiano, congrats on completing this challenge!

  Nice solution and nice code! I can see that you paid a lot of attention to your code/design. If you don’t mind I’ve some tips for you:

  To make your CSS code easier to work you can create a single class to manage the content that is mostly the same for the 3 cards (paddings, colors, margins and etc) and another class to manage the characteristics that are different (colors and icon), this way you'll have more control over then and if you need to change something you modify only one class.

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0