Design comparison
Solution retrospective
Hello There! ππ½
Here is my solution for this challenge!
Built UsingβοΈ :
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- BEM
Questionπ :
For some reason, the input
won't react to my animation styling. Can I get any help on that?
...
Feedbacks on how I can improve my code would be highly appreciated! ππ½
Thank You, and Keep coding! π¨π½βπ»
Community feedback
- @devusexuPosted over 1 year ago
Hello xyzeez! Although I don't know how to fix the animation issue, you might wanna know about
- Use
<form novalidate>
to disable default error message - Use Constraint Validation API to customize your own error message
For example, I tried inputs like
something
,something@
orPlease provide a valid email
only appear forsomething@something
because this pattern is valid for thetype="email"
. Here's the link on MDN about this: Client-side form validationAnother issue is that when I put my pointer on the edge of the button, the button would start to blink, which might cause an epileptic seizure.
Good semantics and accessibility btw! I would use
sr-only
andaria-label
like you in the future works.Marked as helpful0@xyzeezPosted over 1 year ago@devusexu thank you so much for taking your time to view my submission. I'd surely work towards your suggested correction.
0 - Use
Please log in to post a comment
Log in with GitHubJoin 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