如何修复表单控件的宽度?

Ram*_*feh 4 css html5 twitter-bootstrap angular-ui-bootstrap twitter-bootstrap-3

我在HTML中有以下代码:

<div class="col-sm-12">
  <div ng-repeat="param in plugin.wsdlURLs track by $index" class="col-sm-12">
    <select class="form-control col-sm-4" ng-model="test" ng-options="lOrU for lOrU in localOrUrl">
    </select>
    <input type="url" class="form-control col-sm-8 invalidInput">
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我遇到了一个问题,当我放一个form-control类时,它将显示select在一行中,而input在另一行中.我想保留form-control课程,selectinput在同一行显示.我知道问题来自于form-control,因为宽度是100%

Fab*_*ioG 8

好吧,你把很多col-sm列嵌在彼此里面,导致一团糟.试试这个:

<div ng-repeat="param in plugin.wsdlURLs track by $index" class="row">
        <div class="col-sm-4">
            <select class="form-control" ng-model="test" ng-options="lOrU for lOrU in localOrUrl">
            </select>
        </div>
        <div class="col-sm-8">
        <input type="url" class="form-control col-sm-8 invalidInput">
        </div>
    </div>
Run Code Online (Sandbox Code Playgroud)