Four card feature section with HTML + CSS (СSS Grid)
Design comparison
Solution retrospective
Hi, so this is my take on the challenge as a first-timer in HTML + CSS. Can't say if it is elegant or whatever, but there surely are some points for improvement. Could you, please, point them out for me?
Community feedback
- @lailton-bPosted almost 5 years ago
OMG, you sent it very well, wow!! The only thing I would say that you can improve is the shadows, do some research on material design and see how to make the shadows more real, it's really cool!
3 - @nityagulatiPosted almost 5 years ago
The page looks good, Archdron. The code is clean and readable and I like that you split up the stylesheets, nice work! Is there a reason that you put the
border-color
for the cards as inline style in your HTML? I would recommend moving that to your external css.Have you worked with HTML5 semantic tags before? That's something you can work with in your next project. It helps with screen readers and accessibility as well.
And you can also look up SMACSS architecture for organizing your styles, I think you might like it :) I'm currently working with it and it definitely makes life easier especially for bigger projects.
2@archdronPosted almost 5 years ago@nityagulati
Have you worked with HTML5 semantic tags before? Never, but thanks for suggesting :D I'm actually three weeks into a self-paced WebDev course and with very little coding experience, so it's all kinda new to me.
I'll make sure to check out SMACSS, but I think I need to properly wrap my mind around CSS first.
0@nityagulatiPosted almost 5 years ago@archdron Which course are you doing at the moment?
Yeah just keep practicing and once you have a good grasp of CSS, you can look up SMACSS and naming conventions such as BEM to organize and maintain your code. You are doing great :)
1
Please log in to post a comment
Log in with GitHubJoin 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