@DavidMorgade
Posted
Hello DarkDev, congrats on finishing the challenge! great job with the layout
I will try to give some feedback in your grid!
On your sections-reviews-container, you are using Grid but you are not getting the full juice out of it, cause you are positioning the child elements using position: relative and position: absolute!, instead of that you should increase the size of your sections-reviews-container maybe height: 20rem is a decent value, you will notice that now your grid elements scale with the grid. Now you should align each one of them on the respective position using align-self, to have this working you should first remove your positions.
- Lets recap, remove all the position states from your
sections-reviews-container. - Get the width of the
sections-reviews-containerto 20rem. - Use
align-self: flex-startonreview-card-1,align-self: centeronreview-card-2andalign-self: flex-endonreview-card-3
Same result, no strange position needed, less lines of code, and all made with grid!
Hope my feedback helps you, if you have any questions, don't hesitate to ask!
Marked as helpful
@dotfivesix
Posted
@DavidMorgade Thanks for appreciating my work. This suggestion really helped me a lot, the results are even better now and I like this approach. I even replaced relative positioning with CSS alignment in rating-cards section using justify-self inspired from this. So thanks a lot !
