twitter-bootstrap - 如何在 Bootstrap 单选按钮组中制作相同高度的标签和值

Question

我有以下 Bootstrap 单选按钮组，其中标签高度与值的高度不同。

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  

<div class="input-group input-group-lg">
    <span class="input-group-addon" id="addon-title">Type</span>
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary active">
            <input type="radio" name="eventType" value="one"> One
        </label>
        <label class="btn btn-primary">
            <input type="radio" name="eventType" value="two"> Two
        </label>
        <label class="btn btn-primary">
            <input type="radio" name="eventType" value="three"> Three
        </label>
        <label class="btn btn-primary">
            <input type="radio" name="eventType" value="four"> Four
        </label>
    </div>
</div>

我怎样才能改变它，使标签和值的高度没有差距？

Answer 1

尝试像示例中一样对标签使用 .btn-lg 类。

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  

<div class="input-group input-group-lg">
    <span class="input-group-addon" id="addon-title">Type</span>
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary btn-lg active">
            <input type="radio" name="eventType" value="one"> One
        </label>
        <label class="btn btn-primary btn-lg">
            <input type="radio" name="eventType" value="two"> Two
        </label>
        <label class="btn btn-primary btn-lg">
            <input type="radio" name="eventType" value="three"> Three
        </label>
        <label class="btn btn-primary btn-lg">
            <input type="radio" name="eventType" value="four"> Four
        </label>
    </div>
</div>