防止bootstrap在两个表单元素之间断开

Question

我在bootstrap datetimepicker中使用bootstrap并且有点问题。

我的问题最好由this JSfiddle解释。

我想要做的是连续三个单独的表格div，无论屏幕大小如何，它们都保持在一行。我通常会通过简单地使用form-group div来实现这一点（如我所希望的那样＆＃34; JSfiddle），但是在这种情况下，这是不可能的，因为如果我这样做，然后第二个输入混淆了引导日期时间戳的javascript，所以我无法触及form group div。

有没有办法让我想做什么？

我的问题被隔离的HTML是：

<div class="container">
    <div class="row">
        The situation right now:
        <div class="col-sm-2 col-sm-offset-5">
            <div class="form-inline">
                <div class="form-group">
                    <div class="input-group date date-filter" id="start-date">
                        <input type="text" class="form-control" />
                            <span class="input-group-addon">
                                <span class="glyphicon glyphicon-calendar"></span>
                            </span>
                    </div>
                </div>
                <input type="text" class="form-control" id="end-time" />
            </div>
        </div>
    </div>
    <div class="row">
        The situation I want:
        <div class="col-sm-2 col-sm-offset-5">
            <div class="form-group">
                <div class="input-group date date-filter" id="end-date">
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                    <input type="text" class="form-control" id="end-time"/>
                </div>
            </div>
        </div>
    </div>
</div>