How to align text input using image button?

I have a form where the last line of input fields is followed by two image buttons.

No matter what I try, I cannot horizontally align the buttons with the field.

Here's the whole code: http://jsfiddle.net/h3ZPk/

+5
source share
2 answers

Add this rule:

#buttons img, #buttons input {
    vertical-align:bottom;
}

JsFiddle example .

+12
source

I do not often recommend this, but please use the table. They are old fashioned, but they work VERY GOOD for the forms.

<table>
  <tr>
    <td>Label1</td><td><input type="text" /></td><td></td><td></td>
  </tr>
  <tr>
    <td>Label2</td><td><input type="text" /></td><td></td><td></td>
  </tr>
  <tr>
    <td>Label3</td><td><input type="text" /></td><td><input type="button" /></td><td><input type="button" /></td>
  </tr>
</table>

EDIT:

http://jsfiddle.net/h3ZPk/6/

+2
source

All Articles