如何在中型+屏幕上将一系列按钮和输入字段放在一行中 AND 在较小的设备上将这些按钮和输入字段（一部分）分成两行？
所以：在较宽的（中+）屏幕上：1行包含所有按钮和输入字段。在较小的屏幕（xs，sm）上，我想将按钮和输入字段分成两行。
仅在中型+屏幕上显示某些按钮的代码有效。该代码显示在HTML Bootstrap代码下方。
我尝试了很多替代方法，例如此代码，但仅在我的手机上有效。不在中型以上台式机，不在F12移动版等上
<div class="row">
<div class="col-xs-12 col-sm-6">
<button class="btn glyphicon glyphicon-fast-backward not-on-small-screens">L</button>
<button class="btn btn-info">M</button>
<button class="btn btn-info">1</button>
<button class="btn btn-info">2</button>
<button class="btn btn-info">3</button>
<button class="btn btn-info">4</button>
<button class="btn btn-info">5</button>
</div>
<form class="form-inline">
<span class="form-group">
<div class="col-xs-10 col-sm-4">
<button class="btn btn-success glyphicon not-on-small-screens">N</button>
<input type="text" id="search" maxlength="10" size="10" name="search" class="form-control input-inline" #searcher>
</div>
<div class="col-xs-2 col-sm-2">
<button class="btn btn-success glyphicon glyphicon-search">O</button>
<span class="glyphicon glyphicon-list-alt not-on-small-screens">
</span><input type="text" id="size" maxlength="3" size="3" class="form-control input-inline not-on-small-screens" name="size">
</div>
</span>
</form>
</div>
CSS类是：
.input-inline {
display: inline;
}
@media only screen and (max-width: 900px) {
.not-on-small-screens {
display: none;
}
}