Social proof section master solution by [Naimur]
Design comparison
Solution retrospective
Hi! I’m Naimur and this is my Social proof section master solution.
- How was my solution?
- How was the Animation and Hover effect?
- Can I get some suggetion for Responsive part?
Thank you.
Community feedback
- @Ryoshi1001Posted about 1 year ago
Very good website made me like the layout colors and way it is almost the same as design. Tried to go into your html and css file and animation and hover are very good for this I like the keyframes since not using js to add classes for animation. Also wrestled with your code for almost hour to add to responsiveness and try to help your question. It is ok the way it is but for me I like to use 3 rows and 2 rows that respond on page and was trying to find way to share that with you. There is a main, 2 sections, and than two rows in first section and 3 rows in second section. I would try 100% for each section and than add responsiveness from 50% to first two rows to 100% at breakpoint and 33% for the 3 rows break at 50% and break at 100% it is not needed but would look good. I could not fully fix it because you used nth child last child for responsiveness I would have to try and change all of it everyone has own way of writing no one is correct over the other. If you want can try to add class to each section for full 100% and a max-width of 1100px or whatever you want and a margin 0px auto to center the div and than size to inner divs the rows like descript & rating / review-cards while giving main a full width and height auto or full. There are many ways your written code is very good and I wish I could have fully fixed it but maybe someone else can add something thank you take care
Marked as helpful1@NaimurRahman00Posted about 1 year agoDear @Ryoshi1001
Thank you so much for your precious time. Next time I will try to follow your suggestion. You spent almost 1 hour with my code, that's a lot for me. Good luck to you.
Naimur
1 - @kimodev1990Posted about 1 year ago
For responsive design , you could use clamp( ) to change sizes in proportionate with dimension layout sizes to fit in any device. Other than that , Nice work and Keep going on.
1@NaimurRahman00Posted about 1 year agoHello @kimodev1990
Thanks for your valuable suggestion, I don't know about
clamp()
. I will soon learn about this.Naimur
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