Css div未正确对齐

我有一个带有class=“row”的div。在该div中，我尝试将同一行中的两个div对齐。但不知何故，它不起作用

下面是html代码

脱机路由器的数量：{{offlineRouterCnt}
全部的

为什么要指定col-md-4、col-sm-4和col-xs-4。引导缩放，因此您只需要输入col-xs-4和col-xs-8

---

我认为浏览器正在混淆哪一个被声明和堆叠，而不是缩放。

您的代码正在使用Firefox 10.3（macOS High Sierra）。但我想有些浏览器可能与您的自定义内联

width

样式有冲突。尝试删除它。浮动元素的宽度是从引导类设置的

因此，最终的代码可能是：

    <div class = "row">
     <div class = "col-md-8 col-sm-8 col-xs-8" class="alert alert-danger" ng-if="offlineRouterCnt!=0">
      <strong>Number of offline Routers : {{offlineRouterCnt}} </strong>
     </div>

     <div class="input-group col-md-4 col-sm-4 col-xs-4">
      <div class="input-group-btn">
      <button type="button" class="btn btn-primary" aria-haspopup="true" aria-expanded="false">ALL</button>
      </div>
      <input ng-model="naviagtion.searchText" class="form-control" focus-dir placeholder="Search Routers here"></input> 
      <span class="input-group-addon" ng-click="clearSearchAndFilters();">
       <span class="fa fa-times fa-1x"></span>
      </span>
     </div>
   </div>

脱机路由器的数量：{{offlineRouterCnt}
全部的

两个

元素都具有内联

宽度

样式。这将覆盖引导的样式。你为什么要手动指定这个？即使没有指定宽度，它也不起作用。我的电脑中的代码是一样的。它们在一行中。你的代码按照你的期望工作，只是看看这个小提琴，