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

Ping coming soon page - using grid, mobile-first work flow, vanilla JS

@jesuisbienbien

Desktop design screenshot for the Ping single column coming soon page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Under the mobile view, my error message and submit button is too close. I tried adding margin for both element, it still doesn't work (nothing moved). I don't know why? What am I missing here? Any help would be appreciated.

Any other feedbacks are welcome. Happy coding!

Community feedback

Adrian H 420

@AdrianX19

Posted

Hi @jesuisbienbien!

congrats on completing this challenge! really good job! :) The issue you have is caused because <small> elements is an inline and for such elements the top and bottom margin/padding has just not effect, you can do a couple of things to make it working for example you can replace <small> with some block element like <p>, you can change your current element to a block element by adding 'display: block' or you can add margin to your container 'email-error-container' :)

Marked as helpful

1

@jesuisbienbien

Posted

@AdrianX19 oh I didn't know that. Thank you so much for your help.

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