html - 引导响应两列问题

我正在研究引导框架。我对引导网格列进行查询。在单行中，我需要两列，其中第一列应位于左侧，而其他列应位于右侧，并具有自定义字段。它在col-lg上运行良好，我在向左拉和向右拉，但是当我减少“响应式”时，它不是单排就下降。

这是我的代码

<div class="container-fluid">
        <div class="row">
            <div class="col-sm-6 pull-left timer">
                Timer
            </div>
            <div class="col-sm-6 pull-right timer">
                Timer
            </div>
        </div>
    </div>

这是我正在使用的CSS参考样式

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.min.css">

.timer{
background-color: #e2e2e2;
border: 1px solid #a1a1a1;
padding: 10px 40px;
text-align: center;
vertical-align: middle;
margin: 5px;
clear: both;
width:70px;
height:15px;
border-radius: 15px;
font-family: 'Source Sans Pro', sans-serif;
font-size: 16px;
white-space: nowrap;

}

请帮助我哪里我做错了

谢谢
马哈德万

最佳答案

尝试先卸下左拉和右拉。确保您没有任何其他CSS干扰您的布局。

看起来CSS类.timer实际上并没有应用于任何东西，仅仅是FYI。

关于html - 引导响应两列问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/29055756/