Submitted over 2 years ago

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

Kate•170

@YayoKB

Preview site View code

This is a solution for...Intro component with sign-up form

HTML
CSS
JS

1newbie

Design comparison

SolutionDesign

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?

Community feedback

Please log in to post a comment

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