bootstrap - 输入日期类型导致表单控件相互重叠答案

【问题标题】：bootstrap - input date type cause form-control overlap each otherbootstrap - 输入日期类型导致表单控件相互重叠
【发布时间】：2014-10-31 05:57:10
【问题描述】：

如果我减小视图区域宽度，输入日期类型会导致表单控件相互重叠
Test Plunker

<div class="container">
  <h4>Date input type overlap issue</h4>
  <h4>Please reduce view width</h4>

        <div class="row">

            <div class="col-xs-6">
                <div class="input-group">
                    <span class="input-group-addon">Birth Date</span>
                    <input type="date" class="form-control" />
                </div>
            </div>

            <div class="col-xs-6">
                <div class="input-group">
                    <span class="input-group-addon">Name</span>
                    <input type="text" class="form-control">
                </div>
            </div>
        </div>

</div>

预计会显示这个

而是在 chrome 中显示（重叠日期输入）

【问题讨论】：

尝试使用 Bootstrap 的前沿 master 分支
@cvrebert。它不起作用，谢谢。
你可能遇到code.google.com/p/chromium/issues/detail?id=346051
是的，这是同一个问题。但修复不起作用。我认为这是一个错误。
嗯，是的，这是 Chrome 中的一个错误。无论如何，在超小屏幕上，给每个输入单独的行可能更易于用户使用。

标签： twitter-bootstrap twitter-bootstrap-3 angular-ui-bootstrap

【解决方案1】：

您的视口是否有足够的宽度来容纳同一行中的两个输入组？

试试 col-xs-12

【讨论】：

我使用 col-xs-6，所以它应该连续容纳 2 个输入，它不应该重叠。如果我将日期输入类型更改为数字或文本，它会按预期工作。
可能是 Date 的 CSS 属性覆盖了 bootstrap 属性。在控制台中，尝试禁用日期输入属性。