Skip to content
Submitted about 3 years ago

PING Coming Soon (NEED FEEBACK)

Cody Lewis Zites•570
@zitescody
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Ping single column coming soon page
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I need help with the validation. With the code I currently have, how can I implement a simple email validation such as the challenge image shows. I could not get the error message to work properly.

Please provide constructive feedback! Thanks

Community feedback

  • Alex•2,010
    @AlexKMarshallPosted about 3 years ago

    This is looking good. The design is nice and responsive. The semantics are mostly correct.

    Careful with using percentage margin. When the screen size gets above 1300px wide, you get overflow, this should all fit on one page. I would use different centering techniques here. Probably a flex-direction: column; justify-content: center; min-height: 100vh; on the body or a wrapper would do the trick.

    Avoid using <section> unless it's an actually semantically different section of the site and you provide a heading element. Here they are just elements for layout, so make them <div>.

    The <h2> for "Subscribe and get notified" should probably just be a <p>. It's not really a heading for anything.

    For the form validation, this article on MDN explains exactly what you'll need to do https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation#implementing_a_customized_error_message

    Marked as helpful
    1
    Cody Lewis Zites•570
    @zitescodyPosted about 3 years ago

    Cheers, @AlexKMarshall

    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