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, css and javascript

@Scoro6

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


This is my third challenge and I think there is little problem with shadow as I couldn't completely replicate the one shown so how can I do that? Hope anybody helps me.

Community feedback

@ramsaysewell

Posted

Hi Gagan,

Well done for cmpleting this challenge.

As for the alignment of the grid, I would try setting a max-width property of the grid section as it's currently spanning 100% of the window, forcing it to misalign.

If you add max-width: 1000px and make sure to align center your content in the page, you should be able to see the optimised layout. You can align center using Flexbox or simply margin: 0 auto, meaning "automatically adjust from the left and right while not having any margin on the top".

If you try this out on your solution, you should find it to be a lot more responsive and friendly to work with.

Well done!

Ramsay

1

@Scoro6

Posted

@ramsaysewell Hey Ramsay! Thanks for feedback I will definitely look into it to make it more responsive.

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