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 feature section using html and css

@shaswatsingh19

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


Can't find a way to adjust the width of the cards in mobile view.

Community feedback

Lpz 570

@Zepolimer

Posted

Hey ! You should try to change your "@media (max-width)" by 700px or 800px to see the difference when you reduce your window, and maybe put a "width: 375px;" to the container of your boxes. By margin this container to ":0 auto;" it should stay in the middle of your window until the desktop design and it should be easier to adjust your box's width.

I hope it will help you ! (:

0

@shaswatsingh19

Posted

@Zepolimer ok will try , thanks

0
Killer 65

@Aborja-dev

Posted

Hi, you should put a media query min-width because your css breaks if the size of screen is bigger than 375, also you can put a specific height and width in my case the cards are 340x250. No it's a good idea put the font size with rem cause the font grows as the screen and overflow the card, better use the size whose are specified in the style-guide(15px)

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