Base Apparel Coming Soon Page Using CSS Grid and Javascript
Design comparison
Solution retrospective
I found the javascript part the most challneging only because I haven't been using it much lately as i've been focusing on just html and css but it was very rewarding finally getting the form validation working how I wanted it to work. I didn't try to make it responsive as I only focused on 375px and 1440px but I would appreciate advice on how I could setup my code to have my page be more responsive and cleaner looking when it grows. Also Any advice on my code would be much appreciated thank you! :) I forgot does anybody know how to have the email input form and the icon arrow always be next to each other?
Community feedback
- @shashreesamuelPosted over 2 years ago
Good job completing this challenge.
Keep up the good work
Your solution looks great however I think that the button is supposed to be positioned relative to the input field.
In terms of validation errors
-
Any input descendant of a label element with a for attribute must have an ID value that matches that for attribute
-
The value of the for attribute of the label element must be the ID of a non-hidden form control.
I hope this helps
Cheers Happy coding š
Marked as helpful2 -
- @guztrilloPosted over 2 years ago
Hey Chris, great solution! I know you focused only on the the two resolutions that the challenge indicate you, but you as frontend developer, need to satisfy more than two screen types. You need that your clients can look your website from the right way on any device, or at least, a vast majority of devices.
You can achieve this by multiple methods, from using just CSS Grid or Flexbox, but one common way is using media queries, that reviewing your code, you already know how to use it. So you only need to add an extra media query.
Still is a great solution and looks clean. I hope this help you! Keep coding.
Marked as helpful1
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