Css 使用display:table、display:table单元格、display:table行在引导中垂直对齐窗体及其相对的内容

我在bootstrap中对齐表单时遇到问题基本上我的问题并不像问题所暗示的那么可怕，让我详细说明一下：

我有非常简单的标记，如下所示：

<section class="contactus" id="contactus">
            <div class="container">

                <div class="row">

                    <div class="col-md-6 text-center">
                        <address>
                              No. 311,<br> 
                            11th Main, <br>
                            120 Feet Road, <br>
                            indonasia<br>
                              calcutta,<br>
                            pondichury<br>
                        </address>
                    </div>

                    <div class="col-md-6">

                        <form action="" role="form">

                            <div class="form-group">
                                <label for="name">Full Name</label>
                                <input type="text" name="name" id="name" class="form-control" placeholder="NAME">
                            </div>

                            <div>
                                <button class="btn btn-success pull-right">SEND</button>    
                            </div>  
                        </form>
                    </div>
                </div>


            </div> <!-- end of container -->
        </section>

现在，上面的css实际上要做的是垂直对齐.contactus类中心的两个col-md-6，这当然在任何给定屏幕上占据100%的高度

<> p>和在每个COLD-MD 6内，含量应水平在COL-MD -6的中间。 这两种情况都不会发生

现在我做了一些测试，以下是令人惊讶的结果：

首先，让我发布一个指向整个代码的链接：

我将使用和不使用bootstrap保持相同的css，因此使用bootstrap：

如果没有bootstrap，只需删除cdn即可

现在如果没有引导，我会得到我想要的。为什么？因为

display:table;
display:table-cell;
display:table-row;

所有这三个函数是串联的，给我编码的结果

那么引导会发生什么呢

答：今天早上，我发现css中的float属性打破了显示链，因为浮动元素使其显示设置为block，事实上，在我的代码中，我有2个col-md-6，它们只是隐藏在引擎盖下的浮动元素

就目前情况而言，我几乎到了那里，但还没有到那里

还有一件事很重要：

现在，如果我完全取下col-md-6，并在css中添加以下代码：

address, form{
    display: table-cell !important;
    background: red;
    height: 100%;
    vertical-align: middle;
}

我再次得到了我想要的结果，但是，如果没有col-md-6，我的布局就没有响应，那么我该如何解决这个问题呢

最后，我想要的是一个反应灵敏的设计和垂直对齐

多谢各位

亲切的问候

---

亚历山大

旁注：很难调试灼伤眼睛的东西。。。使用较柔和的颜色，红色是痛苦的。红色代表吸引力，但可能会改变为eee:D

address, form{
    display: table-cell !important;
    background: red;
    height: 100%;
    vertical-align: middle;
}