【问题标题】:Placing columns inside bootstrap modal在引导模式中放置列
【发布时间】:2014-04-17 13:39:38
【问题描述】:

我正在尝试让 Bootstrap 模型在其中包含多个列,但它似乎不适用于我的内容垂直显示而不是列显示。我的代码在这里:

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">Modal</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="row-md-6">
                        Left
                    </div>
                    <div class="row-md-6">
                        Right
                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

我发现一些解决了 Bootstrap 2 问题的方法,但它们不适用于 Bootstrap 3。我还尝试将 row-md-6 更改为 smxs 等,但是没运气。是否可以在 Bootstrap 3 中做到这一点?列对我来说是最理想的东西,但我应该一起避免列吗?

【问题讨论】:

    标签: twitter-bootstrap modal-dialog twitter-bootstrap-3


    【解决方案1】:

    Bootstrap 中没有 row-md-*,但 col-md-* 应该可以工作..

        <div class="modal-body">
              <div class="row">
                <div class="col-md-6">
                  Left
                </div>
                <div class="col-md-6">
                  Right
                </div>
              </div>
        </div>
    

    http://www.bootply.com/130819

    【讨论】:

    • 啊!我是个白痴!谢谢哈哈,想想让别人看代码总是好的,因为你总是错过一些东西。
    • 即使我为我的模型编写了这个基本代码,我得到的两列垂直对齐而不是水平排列。这有什么常见的原因吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-04-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-10-31
    • 1970-01-01
    相关资源
    最近更新 更多