This is a solution to the Social proof section challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the section depending on their device's screen size
- Solution URL: [https://www.frontendmentor.io/solutions/from-mobile-first-to-wide-web-addign-normalizecss-VxUpGuzzDV]
- Live Site URL: [https://migbara.github.io/frontendmentor-social_proof_section/]
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
The build process from mobile first to web at 1440px wide. In between, I added some media queries to smooth the views between the two.
I have also learned how to position elements using CSS Grid.
I've added normalize.css to try to make it look the same in all browsers.
Perhaps for the next time, it would be nice to use some tool that allows me to better see the CSS of the elements. Chrome's developer tools don't help that much. I think in Firefox it's a bit better.
- Normalize CSS - This helps normalize viewing across all browsers.
- CodingTube Channel - This is an amazing Youtube channel with hundreds of videos that explain CSS very well. Thanks, David!
- Twitter - @migbara
Thanks to Daniel Primo for helping me find the way to continue learning web programming with his Web Reactiva podcast. And also, many thanks to Bluuweb because he has inspired me and I have a great time watching his videos and live shows.