This project helped me understand CSS Grids in-depth, and how to structure content This is a solution to the Testimonials grid section challenge on Frontend Mentor.
This was a practice project to improve my knowledge of CSS Grids, and also get to practice developing for various screen sizes - Desktop and Mobile. It involved creating a responsive testimonial page.
The challenge was from [Frontend-Mentor] and it involved ensuring the creation of a responsive testimonial page.
From the challenge, Users should be able to:
- View the optimal layout for the testimonial site depending on their device's screen size
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
Some of the tools used during the creation of this project includes:
- HTML5 markup
- Very little Semantic HTML5 markup
- CSS3 custom properties
- Flexbox
- CSS Grid
Truly I am impressed by the project, and how I was able to pull it off. For someone coming from a Product Design background I am truly happy. I tried working on the project using the:
.testimonials {
grid-template-areas:
'...';
}but quickly, I realised that it'll compound the entire thing. Asides this, the entire build was interesting to go through.
Looking forward, I'd be taking more practical projects to really develop my knowledge of CSS Grids