Newsletter-sign-up-form-with-success-message

Community feedback

• 

  Nascimento•360

  @NacsimentoPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  I see you have not used the div tags properly. Instead of giving the <main> tag a class name of container , you can add a <div> of class container inside the main and create two more divs one for the main form and one for the thank you.

  That will make it easier to center you content

  main{
  display:flex;
  align-items:center
  justify-content:center
  height:100vh;
  }
  

  If you have any questions or need further clarification, you can always check out my submission for this challenge and feel free to reach out to me. .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  Marked as helpful

  1

  ---

  

  Reno08-code•300

  @Reno08-codePosted over 1 year ago

  Thank you @Nacsimento for your valuable advice .I will try it again:)

  0
• 

  P

  Jordan Herrera Vera•490

  @jordanhevePosted over 1 year ago

  Hi! I would recommend moving the .thankyou div inside the main element and wrapping the form in another div element to center the main content. Usually, I do this on the body:

  body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  }
  

  The min-height value tells the browser to use 100% of the screen height. By default, it uses 100% of the width but not the height. So, by doing this, you can now center the main container.

  I hope my comment is being helpful to solve your problem Keep coding! :D

  Marked as helpful

  0

  ---

  

  Reno08-code•300

  @Reno08-codePosted over 1 year ago

  Thank you @jordanheve for your suggestion and I borrowed your idea of adding a buzzing effect on the arrow message :) I think it is a really good idea:)

  0