Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Landing Page using CSS Grid, SASS/SCSS *Updated Solution*

@nyrellcl

Desktop design screenshot for the Loopstudios landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Updated the responsiveness of the website.

The <picture> element proved extremely useful when using the same images on different viewports. The images are now set to their designated sizes relative to the viewport size. Utilizing the picture element really improved my knowledge and awareness when it came to responsive designing.

I also did a mobile first approach and WILL continue doing a mobile first approach whenever creating projects. I was influenced by this when i first created a project using Tailwind, which is designed for mobile first approaches. I found this to be a very seamless approach when moving on to developing increasing viewports.

As always, any suggestions to my code and project is greatly appreciated. Thanks for taking the time to go through my project!

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

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