I had an annoying image alignment issue when I was working on a form. I wanted to use an image button as a submit button instead using a default submit input. The image button didn’t align nicely with the label and other input, so I tried this way.

CSS

form#exampleForm button {
padding:0;
border:none;
background:none;
vertical-align:middle;
}

The key point of this method is using vertical-align:middle in CSS and using the button tag in HTML.

HTML

<form id=’exampleForm’ name=’exampleForm’>
<button name=’submit’ type=’submit’>
<img src=’/images/button-submit.gif’ alt=’Submit form’ />
</button>

*Name

*Email (not published)

Website

Source