Skip to content
Submitted about 2 years ago

media query

Ali Mohamed•300
@Ali503-7
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Fylo landing page with two column layout
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

feel free to give me your feedback and a comment ✨🎉

and please I need to know more about SVG because I can't have complete control over them

and also there is a problem with the page sizing there is an extra margin on the right of the page but I can't remove it

thanks every one

Community feedback

  • バレンタイン 😈•64,170
    @VCaramesPosted about 2 years ago

    Congrats @Ali503-7 on completing this challenge!

    To clean up your code and make it semantically correct, you'll want to set ups your code in this manner (only did the parent containers):

     <body>
      <header>
        <nav></nav>
        <section>All your files in one secure...</section>
      </header>
      <main>
        <section>Stay productive, wherever you are</section>
        <section>Get early access today</section>
      </main>
      <footer></footer>
    </body>

    You'll notice that section one is placed inside the <header> element, this is because the <header> element is meant to contain all the introductory content.

    Next, instead of using a <div> to define each section you can use the <section> element.

    Happy Coding!

    Marked as helpful
    0
    Ali Mohamed•300
    @Ali503-7Posted about 2 years ago

    @vcarames thanks for your comment, I'm gonna work on the changes 🌹

    0
  • Divine Obeten•2,415
    @Deevyn9Posted about 2 years ago

    Hi Ali, congrats on completing this project.

    Try adding horizontal padding to the first two sections. Also the footer is overflowing horizontally. These were noticed on the mobile view.

    Happy coding !

    Marked as helpful
    0
    Ali Mohamed•300
    @Ali503-7Posted about 2 years ago

    @Deevyn9 thanks, gonna work on it now 👌

    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