Label and checkbox with height bar

Is it possible to make the label and checkbox inline and height equal without using line-height

or any other css?

Working fiddle from line-height

(workaround) http://jsfiddle.net/yeao6ph7/3/

Script without css http://jsfiddle.net/yeao6ph7/2/

Html

<div class="form">
    <form class="form-horizontal" name="myform" action="">
        <div class="form-group">
            <div class="col-xs-3 control-label">
                <label for="inputCheckbox">Is Checked ?</label>
            </div>
            <div class="col-xs-9">
                <div class="checkbox">
                  <label>
                      <input type="checkbox" id="inputCheckbox" value="option1"/>
                  </label>
                </div>
            </div>
        </div>
    </form>
</div>

      

        
        
        
      

    

Output:

Expected Result:

If css is the only option, is this the correct solution line-height: 35px;

? Since the field input

can be large

as well small

.

Thank you Jigar.

UPDATE

form-horizontal

misspelled. The problem is the same, the violins have been updated. line-height: 35px;

required for height adjustment.

UPDATE 2

There are many label

below and similar to many input

below. So checkbox

the left side won't help.