css - 小型设备上的 Bootstrap 定位问题

Question

我有 Bootstrap 问题。

对于普通屏幕(sm，md，lg)，一切正常。

但对于小屏幕 (xs)，我希望单选按钮部分在输入和按钮之间传递。

请问怎么做？

<div class="row">
    <div class="form-group col-xs-12 col-sm-12 col-lg-3">
        <h4>TITLE</h4>
    </div>
    <div class="form-group col-xs-12 col-sm-9 col-lg-7">
        <input type="text" name="location">
    </div>
    <div class="form-group col-xs-12 col-sm-3 col-lg-2">
        <button type="button">SEND</button>
    </div>
</div>
<div class="col-lg-offset-3">
    <div class="form-group">
        <label class="radio radio-inline checked">
          <input type="radio" name="radio" checked> RADIO 1
        </label>
        <label class="radio radio-inline">
          <input type="radio" name="radio"> RADIO 2
        </label>
        <label class="radio radio-inline">
          <input type="radio" name="radio"> RADIO 3
        </label>
    </div>
</div>

Answer 1

如果您的意思是 2 个换行符，请像这样添加它们:

<br class="visible-xs"/>
<br class="visible-xs"/>

否则，只需将 .visible-xs 类添加到您希望仅在超小可见的任何内容。