Skip to content
Submitted about 3 years ago

Huddle landing page /w flex and grid on the footer element

Bill Georgopoulos•200
@billgeorgop93
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Huddle landing page with alternating feature blocks
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

Likewise in the last project, I used a lot of nested divs using flex and I used grid on the footer element with the help of griddy.io.

Community feedback

  • Ctrl+FJ•810
    @FlorianJourdePosted about 3 years ago

    Hehe, you're the guy who learn me how to use display: grid ! Thanks for following me !

    By the way, nice job ! You're pretty close to the result. I would suggest you to add padding property on your .hero-section on desktop view. On my computer, elements are just going on each side of the screen, which is not pretty nice..

    Also, I think it's better to switch background-color and background-image properties from .top-section to .hero-section and to change your navbar to display: absolute with transparent background. By this way, your header and navbar will share the same background.

    I don't know if my suggestions are relevant, it's only my opinion ! However, nice job, keep going !

    Marked as helpful
    1
    Bill Georgopoulos•200
    @billgeorgop93Posted about 3 years ago

    @FlorianJourde Thanks for your feedback mate. I will fix those things asap. Glad to be a part of this community to help each other learning :D

    1
    Ctrl+FJ•810
    @FlorianJourdePosted about 3 years ago

    @Zer0fr0st93 Always glad to see people joy !

    1

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