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

kellycβ€’ 140

@kelly1801

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


Hi everyone,

I would like to know if it's a good approach to hide the medium hero image in the desktop with display none, to add it again in the medium and small view, thank you.

Community feedback

T.Praveenβ€’ 870

@gwtpraveen

Posted

Hey, congratulations on completing the challenge. I've noticed a problem in the footer background image. It repeated, so to fix that

footer {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

I hope this will help.

Marked as helpful

0

kellycβ€’ 140

@kelly1801

Posted

@gwtpraveen thank you for you feedback it's totally helpful

0
Lucas πŸ‘Ύβ€’ 104,420

@correlucas

Posted

πŸ‘ΎHello Kellyc, congratulations for your new solution!

I think was a good approach the way you did to swap the images, another alternative as inserting these images inside the picture tag and settting in the html when the images should change between devices, I think is the best way since you don't even need to se a media query since you can do everything inside the html.

If you don't know this tag and this approach yet is something you should try for sure in this or in future challenges, here's the guide to use it: https://www.w3schools.com/tags/tag_picture.asp

πŸ‘‹ I hope this helps you and happy coding!

Marked as helpful

0

kellycβ€’ 140

@kelly1801

Posted

@correlucas thank you! I didn't know about the picture tag

1

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