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

Responsive Skilled landing page using CSS Grids

P
Lukáš T. 120

@LukasT1

Desktop design screenshot for the Skilled e-learning landing page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I was able to tackle most things without an issue, had to refresh my memory on certain things. Like implementing svg elements and responsive images into my HTML markup.

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

The most difficult part for me turned out to be the hero section and especially the hero image. Since the assets had a lot of blank space around them. I decided to trim all of them using Photoshop. But still the shadows and the aspect ration of the image made it difficult to position them correctly according to the design files.

I had to use some negative margins so it felt a bit messy. Bu

But in the end it worked out. I did not have to write too much media queries since I used CSS Grid for most of it.

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

I would appreciate any good advice how to make my code cleaner and better organized.

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