html - AngularJS 下拉框宽度防止自动调整大小

Question

HTML

<select class = "box" ng-model="selected" ng-options="person.id as person.name for person in people" >
<option value="">----select----</option>
</select>

CSS

.box {
    height: 21px !important;
    width: 96%;
}

嗨，我正在更新 $scope.people并调用$scope.$apply(...更新下拉列表。当我这样做时，下拉选择框会自动增加大小并根据我的内容调整大小。不过，我的内容还差点溢出。如果我能得到一些帮助，那就太好了!在链接中，$scope.people是静态定义的，因为我无法演示我目前正在使用的消息服务。我可以将宽度固定为某个 px 大小。但是当浏览器窗口大小改变时，盒子的大小不会随之调整。很高兴知道是否有办法解决这个问题!谢谢:) http://jsfiddle.net/Lvc0u55v/7937/

更新我没有提到这个，因为我不知道这会是问题所在。这个选择框在表中。它在 <td></td> 内如果有任何区别，请标记..

Answer 1

请确保你没有固定盒子的高度和宽度，让 Bootstrap 让它自己响应

试试看，效果不错

<div class="container">
<div ng-controller="MyCtrl">
  <select class = "box" ng-model="selected" ng-options="person.id as person.name for person in people" >
    <option value="">----select----</option>
  </select>
</div>
</div>

在 CSS 中:

.box {
    height: auto;
    width: auto;
}