Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted 8 months ago

Loopstudios landing page

sass/scss, cube-css
Ralph Virtucio•710
@ralphvirtucio
A solution to the Loopstudios landing page challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


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

I was able to use Cube CSS, but I'm not satisfied on how I use it, I think there are a lot of practices and things that I can improve on. I would approach it with plain CSS.

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

The challenge that I encounter is implementing the card within the Our Creations because I want to implement with a accessibility in mind, I overcome it by researching and trying different approach in the HTML structure and CSS.

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

I would like to know your opinion with the grid that I did for the cards within the Our Creations. I have two approaches in mind.

  1. Change the grid-template-columns per breakpoint, This will remove the spaces on the left and right side.

  2. Use auto-fill, But in this approach I need to set a max-width so the card will only have 4 columns and then set an margin-inline: auto. To have it center.

For me I chose approach number 2 because it's more responsive and can solve all different breakpoints. Let me know your opinion for this

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Ralph Virtucio's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License