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 signup form using grid

Nazaf 140

@Nazaf64

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


I think I've managed to get everything except one little thing. Would appreciate any tips on how to get the exclamation mark to appear in the placeholder when error occurs. I can make the exclamation mark appear in the placeholder but I'm faced with 2 problems. I can't figure out:

  • How to make the exclamation icon red
  • How to make it appear on the right hand side

Update: Managed to fix the issue with the exclamation mark. Everything seems to be working fine. If there are any other issues that needs fixing that I might have overlooked, please let me know. Thank you

Community feedback

Igor 110

@bubahaze

Posted

Hello, you've got a nice one here, big up! I wish my code looked like yours 😄. Regarding exclamation mark, there an icon-error.svg in images folder, it's already red, you could append a class for input with background-image of icon-error and position it with background-position, just like you did with red borders around input area. In my solution I've got stuck at validation of email in .js, but yours look decent, and I think it could help me understand my mistakes. Cheers, bro!

Marked as helpful

0

Nazaf 140

@Nazaf64

Posted

@bubahaze Thanks. Really appreciate it! I had completely overlooked the icon-error.svg file in the images folder. Thanks for the heads-up. I'll try and incorporate it right away.

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