Skip to content
Submitted over 1 year ago

huddle-landing-page

adithya cj•70
@Adithya-CJ
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

  • I couldn't make the svg change when the screen resolution is changed.
  • Also I wasn't able to make the page responsive.

Community feedback

  • Jyotirmoy Sinha Babu•430
    @jyotirmoy-sinhababuPosted over 1 year ago

    use @media screen for different view like tab and mobile. Instead of using position: absolute and relative for positioning, you can design using flex.

    1. practice @media screen.
    2. practice display: flex or grid.
    3. using display flex has lots of benefits, such as you can give direction , determine the
      gap also you can use justify-content and align-items to position the divs.
    <div class="main"> <div class="child"></div> <div class="child"></div> </div> to style it .main{ display: flex; justify-content: space-around; align-items: center; } --- like this you can style your app. for details study you can visit "w3school".

    ----hope this was helpful.

    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