@GerbenDol
Posted
Hi Siddhant!
- I'd give you a 7 out of 10. If you'd nail the details like spacing and responsiveness a bit better I'm sure that would take it up a bunch! 🔥
- Simply use the
total-containerto set the border radius! Useoverflow: hidden;to make sure the inner content stays inside. - With the above change you'll solve the problem of changes all the corners, as it's set on just a single element.
- The best way of using grid would of course be studying it and learning how to write the grid yourself. If you have trouble doing so check out this cool generator: https://cssgrid-generator.netlify.app/
- With the link to the generator above just build your grid, copy the code and implement it in your layout!
Good luck on your future challenges and don't forget to check out the resources page on here for links to grid tutorials! 😁
@siddhantJH
Posted
@GerbenDol thankyou so much sir!.
@siddhantJH
Posted
@GerbenDol one more question, how can i figure out the correct space between the elements as it is not mentioned in there any way?
@GerbenDol
Posted
@siddhantJH That's a great question and I'm sure more people struggle with this.
In a real world scenario you would obviously be handed over the design file where you can see all these specs. So, your number one solution would be to buy the design file for this challenge.
If that's not an option for you I recommend you get yourself some sort of image processing tool like Photoshop or a free alternative (maybe ask on Slack for people's advice on this) so you can open the image of the design and measure the pixel values of the spacing.
Of course it's also just a matter of practice - by building more you'll get a better feeling for getting the spacing looking great!
@siddhantJH
Posted
@GerbenDol thank's for the great advice, Have a nice day!.
@siddhantJH
Posted
@GerbenDol hey sorry to bother!, but i had gone through my solution and found that the mobile design is not working, ie on reducing the size of window it is not getting aligned as mobile layout.it is stuck in as desktop type. please help! i tried figuring it out but could'nt find the bug....
@GerbenDol
Posted
@siddhantJH Hey, no worries! I've got to go and have dinner and stuff now. But I'll be sure to help you get it working later today. 💪🏻
Just a quick edit: are you sure the solution on the live link is up to date? I don't see any media queries in your CSS at the moment.
