css - 无法让 Bootstrap 列按照我想要的方式工作

标签 css twitter-bootstrap

所以我尝试在页面上设置一个部分,以便当屏幕处于 lg 和 md 模式时,每行有 2 组图像和文字。

所以它应该是这样的......
(img) (文字...) (img)(文字...)
(img)(单词...)(img)(单词...)

<div class="container rowSpacing">
            <h1 class="text-center">We Capture All Memories...</h1>
            <div class="row">

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <img src="images/NewLogo.png" class="img-responsive" alt="...">
                </div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <h2>Your loved ones...</h2>
                </div>

                <div class="clearfix"></div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <img src="images/NewLogo.png" class="img-responsive" alt="...">
                </div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <h2>Your special day...</h2>
                </div>

                <div class="clearfix"></div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <img src="images/NewLogo.png" class="img-responsive" alt="...">
                </div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <h2>Your last moments...</h2>
                </div>

                <div class="clearfix"></div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <img src="images/NewLogo.png" class="img-responsive" alt="...">
                </div>

                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                    <h2>Your beautiful moments...</h2>
                </div>
            </div>
        </div>

最佳答案

尝试删除

<div class="clearfix"></div>

并将每个列设置为设定高度

关于css - 无法让 Bootstrap 列按照我想要的方式工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42823162/

相关文章:

javascript - 如何在调整大小时给导航 100% 宽度(以像素为单位)?

javascript - jQuery - slider 显示错误的图像

javascript - 学习页面加载时间

html - 一行中的中心组 div

javascript - 折叠 Bootstrap 侧边栏

css - 浏览器不显示 JSP 中动态生成的 CSS

jquery - 如何在透明图像上翻转?

html - 使用 twitter 的 bootstrap 和 Rails4 呈现列

css - Bootstrap 模态甚至在调用之前就阻塞了底层元素

html - Bootstrap 列的高度定义为行宽度的百分比