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

Meet Landing Page

P

@Stephanie-Dennehy

Desktop design screenshot for the Meet 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 am proud that I was able to make the design adjustments as the page shifts from desktop to tablet and to mobile.

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

I had some issues with getting the correct images to show up on the correct layouts. I was able to hide the images using media queries so that I only got the images needed based on the layout size.

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

I would love to know if there is a different way to lay out the images and have them swap at the different size breakpoints. (I used media queries and hid images at different breakpoints). Any suggestions for other ways to do this would be appreciated!

Community feedback

P

@hectorlil48

Posted

Great work on this project. I encountered some difficulties with the images when trying to hide them. I noticed that the dividers expand based on the screen size in your solution. I suggest putting step one and two in a div that wraps both the number and the bar. After making this change, I set the circle's height and width to ensure it stays the same size.

Marked as helpful

0

P

@Stephanie-Dennehy

Posted

@hectorlil48

Thank you. I had a hard time with the step numbers and getting them to look right. I will go back and try your suggestion to clean that up a bit.

1
P

@hectorlil48

Posted

@Stephanie-Dennehy I had difficulty with it as well. I placed them in a container and specified the circle's height and width to prevent it from stretching with the screen size.

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