Skip to content
Submitted almost 3 years ago

Responsive landing page using html css and media query

Elvinas•90
@elvinasn
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Huddle landing page with a single introductory section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello, this is the first project that I did for mobile first, instead of going for desktop first. Any feedback and suggestions are welcome.

Community feedback

  • Siege•520
    @idesmarPosted almost 3 years ago

    Hi Elvinas! I think you just encountered a collapsing margin issue on your web app. There's a blank space above and below your <body> element caused by margin-top from .logo and margin-bottom from <main>.

    Quick fix for this issue is to use display: flow-root on your <body>.

    If you want to read more about collapsing margin, this is going to be a good read from CSS-Tricks.

    Happy coding!

    0

Please log in to post a comment

Log in with GitHub

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