Submitted about 3 years ago

Responsive sign-up form using CSS grid, flexbox and JS validation

Kate•170

@YayoKB

A solution to the Intro component with sign-up form challenge

Preview Code

Solution retrospective

The text in my button is not completely vertically aligned. I think this has to do with setting a height and using padding. What could I do to make it completely central?
I had to use margin-top: auto for my headline element and margin-bottom: auto for my description element in order to get both elements vertically aligned in the desktop layout. I used display: flex for their parent container, .upper-text, and used align-items: center but had to use flex-direction: column for them to be on top of one another. Unfortunately, this is what seemed to cause them to be off-center. Is there anything I did wrong here?

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on Kate's solution.

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