Warning: our checkout button was 3px taller than the input field next to it and somehow that broke the whole form vibe | CSS Shenanigans - The Design Community Hub
Warning: our checkout button was 3px taller than the input field next to it and somehow that broke the whole form vibe
Around January our signup form looked fine to me, but I stacked the email box and the submit button side by side with flexbox and the button sat 3px higher than the input, so the whole thing felt lopsided. Turns out I had a leftover line-height of 1.2 on the button plus a default border the browser was adding, and once I set both to the same height the gap vanished, which makes me think most of the "ugly" forms people complain about are just tiny mismatches like this. Does anyone else think we blame big layout choices when the real culprit is a stray 3px gap?