Profile Card Component using custom css properties.
Design comparison
Solution retrospective
Yeah everyone.. Good Afternoon .. Here is my third project and any suggestion for this project you want to tell is welcome ..Thank you
Community feedback
- @j-hutchisonPosted over 2 years ago
Hi Akshita,
Great job on this component!
I'm still on my journey to improve my front-end development skills, but a couple of things that have helped me with structuring my CSS and HTML better are:
- Give all html elements a class name, this will help simplify your css instead of nesting element selectors --> To help with this you can look into a naming methodology called 'BEM' (Block Element Modifier) - sometimes it can look a little unsightly but i think it is worth it on larger projects and also if you work with SCSS in the future
Above all great work and keep it up π
Marked as helpful0 - @ShanviePosted over 2 years ago
Thank you ...It will help me a lot for my next projects And I also say best of luck for your next project or challenge in this platform :D
0 - @Bayoumi-devPosted over 2 years ago
It looks good Akshita! I suggest you put the status of the profile card into the
list item
to add moresemantics
to your project,Div
's don't do much for semantics but a list is much more meaningful..:<ul class="stats"> <li><span class="stats-num">80K</span>Followers</li> <li><span class="stats-num">803K</span>Likes</li> <li><span class="stats-num"> 1.4K</span>Photos</li> </ul>
I hope this is useful to you... Keep codingπ
0
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