Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Mobile first solution to 3-column-preview-card using HTML & SASS.

@Passenger89

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I am open to discussion and for other members of the community to offer feedback. I hope that you can:

  • Offer constructive criticism.
  • Share ideas.
  • Engage with others.
  • Welcome others and are open-minded. Remember that this is a community we build together 💪.

Please take a look at the code and let me know what you think.

Community feedback

@rohits673

Posted

Hi, I checked your site its looks good, nice work👍. There is some improvement you can try like around 500px device width your buttons gets horizontal overflow, so you can try responsive size for buttons or font-size or margin at this point as things get closer. Also please checkout my solutions for any improvement or issue. keep coding. Thanks!

0

@Passenger89

Posted

@rohits673 Hi Rohit, I adjusted the breakpoints to account for this. Any tips on keeping the dimesions of the buttons accurate whilst making them responsive? I tried working with flex basis/shrink/grow but for them to work you can't declare the width and height and they lose their shape.

0

@rohits673

Posted

@Passenger89 Hi, there should be no need to specify width and height for buttons as you can achieve the same result with padding, and responsive margin to your flexbox container, hope it helps .Thanks!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord