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

Simple HTML and CSS used to make a responsive website

@king-qais

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


I might have a little issue making it responsive on mobile. Somehow there is less margin on the right side when viewing on mobile. Also whenever you open it mobile, the website appears slightly zoomed in.

Community feedback

Alex Kim 1,325

@alex-kim-dev

Posted

Hello, the reason for this is that the cards have fixed width of 350px. If you open the page on 375px wide screen the total width (card + margin & padding) will exceed that limit, and the page will have a horizontal scroll. Typically the mobile layout is made using width: 100%; to make sure it's always full width.

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