Bootstrap：如何避免表单输入的响应性？

Question

我有形式是这样的：

如果我缩小显示尺寸大于宽度的一半我得到这个。

我怎么能禁用此行为在默认吗？

感谢您的任何建议。

编辑：

模板的代码形式：

<div class="container customContainer" id="workerDetail" data-ng-controller="LocationsCtrl" 
    ng-init="initEmptyLocation();" 
    xmlns="http://www.w3.org/1999/html"> 
    <!-- DEBUG DIV --> 
    <div class="debugDiv" ng-show="$root.debugable == true"> 
    {{locationDetail}} 
    </div> 

    <div class="page-header"> 
    <ul class="pager"> 
     <li class="previous"><a href="/#locations">&larr; </a></li> 
     <li class="previous"><a class="savecstbtn"> 
     <button 
      type="button" 
      class="btn btn-xs savecstbtn btn-link" 
      ng-click="createLocation(locationDetail)" 
      ng-disabled="locationForm.$invalid" 
      > 
      {{ 'SAVE' | translate }} 
     </button> 
     </a> 
     </li> 
    </ul> 
    <h1 class="savecstbtnHeading">{{ 'NEW_LOCATION' | translate }} </h1> 

    </div> 


    <ul class="nav nav-tabs"> 
    <li class="active"><a data-target="#home" data-toggle="tab">{{ 'INFO' | translate }}</a></li> 
    <!--<li><a data-target="#activities" data-toggle="tab">{{ 'PROJECTS' | translate }}</a></li>--> 
    </ul> 

    <!-- Tab panes --> 
    <div class="tab-content"> 
    <!-- USER DETAIL --> 
    <div class="tab-pane active" id="home"> 
     <div class="row detailPaddingTop"> 
     <form role="form" name="locationForm" id="locationForm" class="detailForm"> 
      <!-- USER EDIT FORM PART 0 --> 
      <div class="col-md-3 column"> 
      <div class="form-group"> 
       <label for="city">{{ 'ADDRESS_CITY' | translate }} </label> 
       <input type="text" ng-model="locationDetail.address.city" class="form-control" id="city"/> 
      </div> 
      <div class="form-group"> 
       <label for="street">{{ 'ADDRESS_STREET' | translate }} </label> 
       <input type="text" ng-model="locationDetail.address.street" class="form-control" id="street"/> 
      </div> 
      <div class="form-group"> 
       <label for="streetNumber">{{ 'ADDRESS_STREET_NO' | translate }}</label> 
       <input type="text" ng-model="locationDetail.address.streetNumber" class="form-control" id="streetNumber"/> 
      </div> 
      <div class="form-group"> 
       <label for="district">{{ 'ADDRESS_DISTRICT' | translate }}</label> 
       <input type="text" ng-model="locationDetail.address.district" class="form-control" id="district"/> 

      </div> 
      <div class="form-group col-md-6"> 
       <label for="latitude" class="">{{ 'ADDRESS_LAT' | translate }} {{ '*' | translate }}</label> 
       <input type="text" ng-model="locationDetail.address.latitude" 
        class="form-control gpsLat" 
        id="latitude" required/> 
      </div> 
      <div class="form-group col-md-6"> 
       <label for="longitude">{{ 'ADDRESS_LON' | translate }} {{ '*' | translate }}</label> 
       <input type="text" ng-model="locationDetail.address.longitude" 
        class="form-control gpsLon" 
        id="longitude" required/> 
      </div> 
      </div> 


      <!-- USER EDIT FORM PART 2 --> 
      <div class="col-md-3 column"> 
      <div class="form-group"> 
       <label for="siteId">{{ 'SITEID' | translate }} {{ '*' | translate }}</label> 
       <input type="text" ng-model="locationDetail.siteId" 
        class="form-control" id="siteId" required/> 
      </div> 
      <div class="form-group"> 
       <label for="shared">{{ 'SHARED' | translate }}</label> 
       <select id="shared" ng-model="locationDetail.shared" class="form-control"> 
       <option value="true">{{ 'YES' | translate }}</option> 
       <option value="false">{{ 'NO' | translate }}</option> 
       </select> 
      </div> 
      <div class="form-group"> 
       <label for="sapSacIrnCode">{{ 'SAPSACIRNCODE' | translate }}</label> 
       <input type="text" ng-model="locationDetail.sapSacIrnCode" class="form-control" id="sapSacIrnCode"/> 
      </div> 
      <div class="form-group"> 
       <label for="stationType">{{ 'STATION_TYPE' | translate }} {{ '*' | translate }}</label> 
       <input kendo-auto-complete 
        required 
        ng-minlength=1 
        id="stationType" 
        class="form-control" 
        ng-model="locationDetail.stationType.name" 
        k-options="customOptionsStationType"/> 
      </div> 
      </div> 

      <!-- USER EDIT FORM PART 1 --> 
      <div class="col-md-3 column"> 
      <div class="form-group"> 
       <label for="abloyLocation">{{ 'ABBLOY_LOCATION' | translate }}</label> 
       <input type="text" ng-model="locationDetail.abloyLocation" class="form-control" id="abloyLocation"/> 
      </div> 
      <div class="form-group"> 
       <label for="bsc">{{ 'BSC' | translate }} </label> 
       <input type="text" ng-model="locationDetail.bsc" class="form-control" id="bsc"/> 
      </div> 
      <div class="form-group"> 
       <label for="indoorOutdoor">{{ 'INDOOR_OUTDOOR' | translate }} {{ '*' | translate }}</label> 
       <select id="indoorOutdoor" ng-model="locationDetail.indoorOutdoor" class="form-control" required> 
       <option value="Indoor">{{ 'INDOOR' | translate }}</option> 
       <option value="Outdoor">{{ 'OUTDOOR' | translate }}</option> 
       <option value="IndoorOutdoor">{{ 'INDOOR_OUTDOOR_TYPE' | translate }}</option> 
       </select> 
      </div> 
      <div class="form-group"> 
       <label for="partner">{{ 'PARTNER' | translate }} {{ '*' | translate }}</label> 
       <input kendo-auto-complete 
        id="partner" 
        class="form-control" 
        ng-model="locationDetail.partner.name" 
        k-options="customOptionsPartner" 
       /> 
      </div> 
      </div> 


      <!-- USER EDIT FORM PART 3 --> 
      <div class="col-md-3 column"> 
      <div class="form-group"> 
       <label for="accessNote">{{ 'NOTE' | translate }}</label> 
         <textarea id="accessNote" ng-model="locationDetail.accessNote" rows="14" cols="34"> 

         </textarea> 
      </div> 

      </div> 
     </form> 
     </div> 
    </div> 

    </div> 
</div> 

Answer 1

它不是你应该看看，它的网格中的字段，您已经列设置为COL-MD或col-sm，将它们更改为col-xs，如果要禁用整个网站的响应性，请阅读以下内容：http://getbootstrap.com/examples/non-responsive 像保罗提到的那样