Skip to content
Submitted about 1 month ago

Newsletter Signup Form with Vite, React, CSS modules, React Hook Form

Ronald Yonggi•190
@ronaldyonggi
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Newsletter sign-up form with success message
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

What challenges did you encounter, and how did you overcome them?

Having issues where when I used the illustration images svg, somehow the displayed image would have additional white space either at the top or bottom. I ended up getting rid of the padding in my desktop design to get rid of the extra whitespace, although this causes my final design to not have padding unlike the desired design

What specific areas of your project would you like help with?

Anyone else having issues with the illustration svg files, where when displayed you'll see extra white space?

Community feedback

  • Derik Boghozian•230
    @psychederikPosted about 1 month ago

    First off, great job! Your app functions as intended.

    To answer your question, I'm not 100% sure where the extra white space is coming from on your illustration svg. If I had to guess, maybe check these two things: .image { "width: 100%" } , OR perhaps try using the <picture> element instead of determining the size with a React className.

    I am still in the earlier stages of the React learning process so these are just my guesses. Hope you find a solution to the extra white space! Keep up the great work 👍

    0

Please log in to post a comment

Log in with GitHub

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