'Vertical Align label with radio input in Bootstrap 3

How do I vertically align the text of a label with the input radio using Bootstrap 3 ? Here I had to manually specify the margin-top.

<style type="text/css">
div.radio label input[type=radio]
{
    width: 30px;
    height: 30px;
}

div.radio label span
{
    display: inline-block;
    height: 30px;        
    margin-top: 10px;
    margin-left:25px;
    font-weight: bold;
}

label input[type=radio]
{
    transform: scale(1.5);
}    
</style>

<div class="radio">
    <label>
        <input type="radio" name="radio-opt">
        <span>Yes</span>
    </label>
</div>

<br/>

<div class="radio">
    <label>
        <input type="radio" name="radio-opt">
        <span style="margin-top:0px;">No, Longer Text<br/>Longer Text</span>
    </label>
</div>

enter image description here



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source