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

Newletter Signup w/ Javacript, HTM/ and Css

@jolman009

Desktop design screenshot for the Newsletter sign-up form with success message coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

hannerr 70

@hannerr

Posted

Hi, First of all, nice job! There are some minor issues with the design, you might want to fix. -> the vertical alignment is not center in desktop version, it´s a bit tricky with grid, I know - if you give the section: {display: grid; place-items: center; height: 100vh;} it is centered. -> the input field needs to change the border & text color too if input is invalid -> the sizing is a bit off (width in desktop & the margin right) There is 100 ways to do this, I´m still working on getting this right. I hope this helps!

0
hannerr 70

@hannerr

Posted

Hi, First of all, nice job! There are some minor issues with the design, you might want to fix. -> the vertical alignment is not center in desktop version, it´s a bit tricky with grid, I know - if you give the section: display: grid; place-items: center; height: 100vh; -> the input field needs to change the border & text color too if input is invalid -> the sizing is a bit off (width in desktop & the margin right)

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