Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Intro component with sign up form using HTML, CSS and JS

@shadib0797

Desktop design screenshot for the Intro component with sign-up form coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any suggestions on how can make my code neater.

Community feedback

@MisterEdel

Posted

Hi Shadib, it looks good. I have some suggestions to your code:

  1. Add labels to the input, you can hide them with something like bootstraps .sr-only class
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}
  1. Use a real button, instead of div role="button" you could use button type="submit"
0

@shadib0797

Posted

@MisterEdel that's what i want to know why my JS validation changes does not persist when using button type="submit" or any other, they show up like for 1 sec and then disappears.

0

@MisterEdel

Posted

@shadib0797 you could use preventDefault on the click event to stop the submission if there are errors. See here: https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

0

Please log in to post a comment

Log in with GitHub
Discord logo

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