Experiment - CSS - Exact same height and alignment of text and input text box in major browsers

HTML

<div style="padding:10px; font-family: Calibri; font-size: 8px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 8px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size: 9px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 9px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size: 10px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 10px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size: 12px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 12px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size: 14px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 14px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size: 16px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 16px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size: 18px;">
<div class="lf-ui-label" 
    style="width:25%; padding-left: 10px;">Field text 18px&nbsp;</div><input 
    class="lf-ui-form-item" type="text" id="fr" name="fr" value="some value" style="width:71%" />
</div>

<div style="padding:10px; font-family: Calibri; font-size:...

CSS

div.lf-ui-label {
    margin: 0px;
    font-size: inherit;
    font-weight: bold;
    background-color: #CCCCCC;
    border-width: 0px;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    padding-top: 4px;
    padding-bottom: 4px;
}
div.lf-ui-label + input.lf-ui-form-item {
    padding: 5px 10px 5px 10px;
    margin: 0px 0px 0px -10px;
    font-size: inherit;
    background-color: #2b55a8 !important;
    vertical-align: middle;
    border-width: 0px;
}
input.lf-ui-form-item {
    background-color: #3b3b3b;
    font-size: inherit;
    padding: 4px 7px 4px 7px;
    font-weight: bold;
    border: none 0px;
    outline: none;
}