Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Derek Vha
Derek Vha
10,452 Points

CSS Forms - Easy way to get input boxes same length?

Hi,

So I am playing about with forms, and input boxes etc. Now my question is, is there a simple way to get the 'input type text' to be all the same length / align correctly?

I know I could probably target each input box and alter the width, but I want them all to be aligned correctly.

I will try to add a screenshot if i can,

https://ibb.co/hpvnHF

So I want the first input box to be directly above the second input box.

Thanks

1 Answer

Martin Zarate
Martin Zarate
10,723 Points
Martin Zarate
Martin Zarate
10,723 Points

You can use the "Non-Breaking Space" HTML character to force the spacing:   Then use some media query styles to rearrange the elements when viewed on a smaller screen, basically, find the "breaking point" when to the make them stack. Hope this helps.