The font has a big white space underneath and changing line-height property seems to have no effect for centering the text. Could do a hack with padding, but it's inconsistent depending on the number of lines of text. Any tips for a better solution?
Used vanilla JS to add/remove elements and directly manipulate the DOM as I wanted to practice/better understand that. For a real project would likely have used a framework like Astro and just conditionally rendered content. Another approach would be to create a separate card for the thank-you state, and swapped 'display: none' between it and the initial state card. Seems cleaner in one sense to keep the page content together in the HTML and handle just the business logic in the Javascript. What would be the recommended/best practice approach?
@hyrongennike
Posted
HI,
I used the display none for the thank you seemed like simplest solution. Just one thing I am able to click submit without selecting a value maybe just disable the button until a value is selected or have a default of 1 currently it says undefined.
Marked as helpful
@jblaszak
Posted
@hyrongennike Thanks, I had noticed that it allowed a user to submit without a value but got distracted by something else and forgot. Will fix that up!
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
