@ozzy1136
Posted
You have laid things out pretty well, nice job!
I would recommend you look into the <picture/> element to handle the image. You can use this element with child <source/> elements that use media queries to serve the image based on the viewport size. Check out the MDN Web Docs for a reference.
For the e-mail input, you are using the <label/> element incorrectly. This element is used to describe the input it references and usually doesn't contain images; in your case, it could be <label>Submit</label>, since the submit button doesn't have any visible text. Additionally, the browser already displays an error if the input isn't formatted correctly as an e-mail address. If you want to implement your own validation, check out the MDN Web Docs for a detailed guide.
Lastly, read through the Accessibility and HTML reports for your solution here on Frontend Mentor, I've found them very helpful for making sure I have the basics correct.
Marked as helpful
@hkmarcoot
Posted
@ozzy1136 Hi Ozmar I have updated with the picture tag, thanks for the MDN Web Docs link. I also fixed button without text problem using the first method in this article . A more correct email checking is added as well. Thanks for helping me out.
