Social Proofing section using dispaly positioning.
Design comparison
Solution retrospective
Please do review my code and give your suggestions. With many trial and error i some how managed to get the design structure but still very much confused on the display of different sections. Any kind of help is appreciated. Thanks in advance :)
Community feedback
- @JakubKepakPosted almost 4 years ago
Hi InduRajput, nice work! The desktop view is pretty close to the design. 👏
My food for thoughts:
- I would name
class
attributes in HTML something meaningful. That is just my opinion. It's easier to navigate in css file - I would position the boxes (
sectionX
in your code) with css grid or flexbox. I would create a container for all withdisplay: flex
orgrid
. You can then shift them by adding margin. - Similarly, I would approach the
rating-sec
container.
With this you can then change ordering by changing
display
property on container toflex-direction: column
, if you would use flexbox.Keep coding! 🙌
0@InduRajputPosted almost 4 years ago@JakubKepak Thank you so much :) for taking your time to review and giving your feedback, Will surely try to incorporate that in my code.
0 - I would name
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