引导输入按钮包含在IE8中

时间:2014-09-02 18:13:03

标签: css internet-explorer-8 twitter-bootstrap-3 radio-button

IE8中的Bootstrap按钮包装存在问题。标记如官方示例所示:

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
    <input type="checkbox" checked> Option 1 (pre-checked)
  </label>
  <label class="btn btn-primary">
    <input type="checkbox"> Option 2
  </label>
  <label class="btn btn-primary">
    <input type="checkbox"> Option 3
  </label>
</div>

然而,它导致以下结果:

Bootstrap buttons wrapping in IE8

有人知道这是否是现有修复的已知问题?

2 个答案:

答案 0 :(得分:1)

按钮有足够的空间吗?有时在IE中渲染字体和其他差异可能会导致问题。也许强制显示类型会有所帮助。

.btn-group { 
    display: block; 
}

答案 1 :(得分:0)

我使用了对齐的类并使用网格系统来调整它的大小:

<div class="row">
    <div class="col-xs-3 col-xs-offset-9">
        <div class="btn-group btn-group-justified" data-toggle="buttons">
            <label class="btn btn-primary">
                <input type="radio" name="ActionResult" id="ActionResult" autocomplete="off" value="A">
                Approve
            </label>
            <label class="btn btn-primary">
                <input type="radio" name="ActionResult" id="ActionResult" autocomplete="off" value="R">
                Reject
            </label>
        </div>
    </div>
</div>