How can I get my boxes to align with one another if the text in the is longer than the others.
I have this entire form within an unordered list.
I have copied and displayed the code via jsFiddle, you can find what I am speaking of here...
http://jsfiddle.net/EFByC/
HTML | <input> align Attribute left: It sets the alignment of image to the left. it is a default value. right: It sets the alignment of image to the right. middle: It sets the alignment of image to the middle.
We specify the margin-bottom of our <div> element. Then, we set the display of the <label> element to "inline-block" and give a fixed width. After that, set the text-align property to "right", and the labels will be aligned with the inputs on the right side.
When using the box alignment properties you will align content on one of two axes — the inline (or main) axis, and the block (or cross) axis. The inline axis is the axis along which words in a sentence flow in the writing mode being used — for English, for example, the inline axis is horizontal.
Your <label>
tags were wrapping the <input>
tags which was causing the issue of trying to treat them separately with CSS:
http://jsfiddle.net/EFByC/3/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With