繁体   English   中英

引导程序输入组未分组

[英]bootstrap input-group not grouping

我正在尝试使用input-group将这两个div组合在一起,因此看起来像这样,但是第一项是下拉选择。

在此处输入图片说明

现在看起来像什么

在此处输入图片说明

我听说使用这里的select引导程序不起作用。 这可能在这里吗?

我怎样才能像第一张照片那样使两者彼此相邻?

PS请看一下结构,因为专有,我删除了一些名称。

谢谢!

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <div class="input-group"> <div class="col-md-4 col-sm-3" ng-init="vm.Current = vm.interval"> <select class="form-control" ng-model="vm.Current" ng-options="interval.set for interval in vm.intervals"></select> </div> <ng-form name="intervalsForm"> <div class="col-md-5 col-sm-9" ng-repeat="interval in vm.intervals" ng-show="vm.Current == interval"> <ng-form name="singleForm"> <input type="text" class="form-control" placeholder="HH:mm:ss" name="single" id="interval" ng-model="vm.Interval" ng-pattern="/^\\d{2}:\\d{2}:\\d{2}$/" ng-class="{inputError: single.interval.$error.pattern && intervalForm.interval.$dirty || single.interval.$invalid || vm.settings.$submitted && intervalForm.interval.$invalid}" required/> </ng-form> </div> </ng-form> <span class="input-error-span" ng-show="(intervalsForm.$dirty || intervalsForm.$invalid) && intervalsForm.$invalid">{{ vm.validationMessages.intervalHHmm }}:ss</span> </div> 

您可以按照以下方式进行操作:

 .form-control .form-control { border:0; } 
 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <div class="input-group"> <span class="input-group-addon"> <select></select> </span> <input type="text" class="form-control"> </div> 

尝试自定义您的代码,使其看起来像这样。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM