Submitted 3 months ago

Testimonials grid section - HTML, SCSS, RWD, grid layout

webdevbynight•410

@webdevbynight

Preview site View code

This is a solution for...Testimonials grid section

HTML
CSS

2junior

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

I used microdata to enhance semantics.

What challenges did you encounter, and how did you overcome them?

Concerning the background image on the first card, I wanted to use the background-position-x property to change the side-related value within the media query where the position of the background image changes, but Google Chrome 128 (and Blink-based browsers) does not support side-related values such as right 80px in such a property. So, I decided to use the background-position property, where Google Chrome supports it.

What specific areas of your project would you like help with?

No particular help requested.

Community feedback

Artiom•120
@Artiom-DeyevPosted about 2 months ago
The solution include very well constructed semantic html. Very good folder structure for the usage of scss, especially the 'base' folder. The code is easily readable, maybe adding more comments and spaces between the sections would help a little bit, but it's a minor thing.

The site is well responive, I can see that it has different designs for desktop, tablet and mobile, which is very considerate and well done.

To be honest, I don't see what improvements can be made. I've noticed the testimonials do differ a little bit in size (so do mine in my solution) but it's a minor thing and I don't think its that important. Well done.
0

Please log in to post a comment

Join 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