Question

我使用Bootstrap在Angular中有一个水平表单。我有一个日期字段，只是略微错位。这是我编写的bootstrap分区的代码。

 <div class="form-group">

                    <div class="col-md-offset-6">
                        <div class="col-md-12">
                            <label class="col-md-1 control-label">Ismessedup Date:</label>
                            <div class="col-md-2"></div>
                            <div class="col-md-4">
                              <p class="input-group">...

以下是它的小提琴：http://jsfiddle.net/c2bv2e6g/ 您必须将屏幕扩展到宽视图才能看到我在说什么。

现在标签的左边缘是匹配的（虽然它没有正确地在小提琴中进行，但不确定原因），但是与输入字段相比，IsMessedUp日期选择器的输入字段是右边几毫米它上面。这就是我想解决的问题。

我已经能够按照我喜欢的方式排列标签和日期选择器，但随后日期选择器被压扁，因此您无法再看到整个日期。我想让它们排成一行但延长了datepicker输入字段的长度。我这样做是通过更改代码来实现的：

                    <div class="col-md-3"></div>
                    <div class="col-md-3"></div>
                    <div class="col-md-3 col-sm-6">
                        <label class="col-md-6 control-label">Ismessedup Date: </label>

                        <div class="col-md-6">
                            <p class="input-group">..

最终，我希望场地足够大，可以看到日期以及排列在它上方的场地。

Answer 1

引导网格是基于百分比的。因此，当你以所拥有的方式覆盖所有内容时，几乎不可能排序，因为每列都在计算不同大小父级的％宽度。你想简化和思考你真正想要的网格......

试试这个： http://jsfiddle.net/c2bv2e6g/3/

sudo

角度水平形式的Datepicker字段未对齐

1 个答案: