Html 如何使用@media在输入上方设置标签？

我有一个简单的引导块，如下所示：

<div class="form-horizontal" role="form">
    <div class="form-group">
        <label class="col-sm-3 control-label" for="textinput" style="text-align:center">Server IP</label>
        <div class="col-sm-4">
            <input type="text" placeholder="Enter IP Address" class="form-control">
        </div>
        <label class="col-sm-1 control-label" for="textinput">Port</label>
        <div class="col-sm-3">
            <input type="text" placeholder="Enter Port" class="form-control">
        </div>
    </div>
</div>

主要问题出现在较小的分辨率上，如1280*600：

正如您所看到的，ip的mos不可见，因此我想在输入上方设置如下标签：

<div class="form-horizontal" role="form">
    <div class="form-group">
        <label class="col-sm-3 control-label" for="textinput" style="text-align:center">Server IP</label>
        <div class="col-sm-4">
            <input type="text" placeholder="Enter IP Address" class="form-control">
        </div>
        <label class="col-sm-1 control-label" for="textinput">Port</label>
        <div class="col-sm-3">
            <input type="text" placeholder="Enter Port" class="form-control">
        </div>
    </div>
</div>

服务器IP
港口

我想你的意思是600x1280，而不是相反，因为1280x600相当宽

像这样的怎么样

<div class="form-horizontal" role="form">
    <div class="form-group">
        <div class="col-xs-7">
          <div class="container-fluid">
            <div class="row">
              <label class="col-xs-12 col-sm-3 control-label" for="textinput" style="text-align:center">Server IP</label>
                <div class="col-xs-12 col-sm-9">
                  <input type="text" placeholder="Enter IP Address" class="form-control">
                </div>
            </div>
          </div>
        </div>
        <div class="col-xs-5">
          <div class="container-fluid">
            <div class="row">
                <label class="col-xs-12 col-sm-3 control-label" for="textinput">Port</label>
                <div class="col-xs-12 col-sm-9">
                    <input type="text" placeholder="Enter Port" class="form-control">
                </div>
            </div>
          </div>
        </div>
    </div>
</div>

服务器IP
港口