@Yazdun
Posted
Hello Ildrim and congrats on finishing this challenge 👏! Here are my suggestions:
- There is way too much usage of
margin
andpadding
in your css ! for texts you can usetext-align:center
andtext-align:left
and you don't need anymargin
on them. - Give
border-radius:10px
andoverflow:hidden
to the parent element instead of givingborder-radius
to children separately. - Instead of giving
margin
to children, give apadding
to parent so everything will align nicely. - for stats I think you'll be better off with something like
<ul>
<li>10k+<span>companies</span></li>
<li>314 <span>templates</span></li>
<li>12m+ <span>queries</span></li>
</ul>
You don't need seperate ul
for each single stat.
- for centralizing your element you can use
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
on your body instead of giving static margin
to the elements.
- Make sure to give
width:100%
and thenmax-width:...px
so your design won't break on smaller screens. - There is no need for
p-div
you can stylep
itself instead.
✅ Also I opened a pull request to your repository which will fix some of these issues
I hope this was helpful
Marked as helpful
@Ildrim
Posted
hello @Yazdun and thank you very much for your elaborate response, and your meticulous revision of my code. You were very helpful, since you reminded me things that in the heat of the moment i forgot and you've also shown me approaches that i hadn't think of, and for that i'm very grateful. I'll try my best to keep the things you've shown me in mind and implement them on my next projects.
Another question that i would like to ask was that from what i've noticed from my approach, your revision and other peoples solutions though, was that the typography sections were always kinda off, and wouldn't resemble the original design. To which i believe (and correct me if im wrong) is kinda impossible to achieve unless you have the pro version for the figma/ sketch info? So should i just focus on getting the general idea of the project together and not focusing too much to make mine a complete look-a-like?
Once again thank you for your time and helpful comment :)
PS. I really liked the way your code was written, it was nice and clean :)
Cheers!
@Yazdun
Posted
@Ildrim Glad I could help ! In regards to your question, Yes you are right ! unless you have access to original design, it becomes so annoying to create a pixel perfect solution ! Still you can manage to do it but in my opinion it's really unnecessary, When I open someone else's solution I look into functionality and responsiveness and then the code readability, I've seen people spending so much time on accessibility and that's what I think worth looking into ( as I'm very bad at it myself 😁 ) Creating a pixel perfect solution is not that much of a deal for me but again that's up to you to decide !
@Ildrim
Posted
@Yazdun thank you once again for all the help you've provided me and the time you've spent in doing so!
I wish you a wonderful day ! ^^