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

Loopstudios challenge React, TailwindCSS

Rina 100

@dodrin

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


Hello, I'm a Junior Full Stack Web Developer with a passion for design and front-end development. I used React and Tailwind CSS to get better at them. I appreciate your feedback!

Community feedback

P

@mohammedbahnini

Posted

Hi, nice result for this challenge, although I have some points you can improve:

  • Don't give a max-width to the body, this solution is not great for larger screens, instead you can create a container class and give it max-width and paddings (left and right only).
  • To make the text overlap the image you can use position absolute for the text.
  • For see all button, you can use an anchor tag or a button and give it the style.
  • Instead using two sections for the grid, you can use one section and put the images in a picture tag (this going to help a lot in term of responsiveness).

Marked as helpful

0

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