Question

I am using the checkbox in the following manner.
The screen shot in Firefox

And the sceen shot in IE8 is here

Here is the code

<div>
   <div>Testing :</div>
   <div><input type="checkbox" value="1"/> One</div>
   <div><input type="checkbox" value="2"/> Two</div>
   <div><input type="checkbox" value="3"/> Three</div>
</div>

How to align the text at the center vertical in both the browsers?

Answer 1

Write this in your CSS –

input[type="checkbox"]{
    vertical-align: middle;
}

Working Demo

Inline CSS trick works on WIN XP. Try –

<div><input type="checkbox" value="1" style="vertical-align: middle;" /> One</div>