Hi guys! Just completed my 6th project on 6th day. Its about 'social proof section". I built it using CSS Flexbox completely. kindly go through and give me feedback.
Hey there, Guliye! 👋
It's great to see you completing so many challenges! 😃 Well done once again! 👍 Your solution looks good and responds well! 🙌
I'd like to suggest,
max-width to the main container or wrapper to prevent the content of the page from becoming too stretched on extra-large screens.Keep coding (and happy coding, too)! 😁
@ApplePieGiraffe Thanks for the feedback. I appreciate. i wanted to add the bottom-right background image using the pseudo ::after but i failed to produce the exact matching of the design. so i just said leave it. any suggestion on how i can add to that image??
@guliye91
I suggest using CSS background images to add and position the background shapes in this challenge. That'll keep them out of your HTML and make your markup cleaner, and I think they're a little easier to style without getting in the way of other elements on the page this way. As long as the body as always at least as tall as the viewport (which you can make sure of by adding min-height: 100vh to the body), you can set the background-position property of that background image to bottom right, and it should always stick to the bottom-right corner of the screen. Here's a nice article from MDN web docs that helped me learn all about borders, backgrounds, and background images that you may find helpful. Good luck and have fun! 👍
Oh, and hey, if you find these comments helpful, an upvote would be appreciated! ;)
Give some feedback to guliye91 about their solution
Join over 30,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!
P