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

Four card Section using HTML, CSS and Flexbox

@Sk7867

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any suggestions or improvements are welcome. Note: I have used hover states if you have more hover states ideas I would like to try them.

Community feedback

P
Patrick 14,265

@palgramming

Posted

well in a browser from 1110px to 950px wide you have cards exiting the left and right side of the browser. You might consider a middle transition between the mobile and desktop layout. A layout with 2 columns with 2 cards each. If you use grid template areas it makes it easy to rearrange your layout as the screen size changes pretty easy to control with a few lines of code

0

@Sk7867

Posted

@palgramming Thanks for the suggestion, this is the first time I feel using a grid is better than flexbox.

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