包括单选按钮时对齐不匹配

时间:2015-12-10 17:23:18

标签: html angularjs twitter-bootstrap-3

我尝试将段落属性与以下分割元素对齐,以使它们看起来像一个表格。当我在其中一个分区中包含单选按钮时,表格未对齐,我不确定为什么会发生这种情况。如果我删除单选按钮元素一切都很好。不知道为什么会导致错位。

<div class="row">
            <div class="form-group">

                <p class="col-md-3 badge">Rep</p>
                <p class="col-md-2 badge">Con</p>
                <p class="col-md-2 badge">Fre</p>
                <p class="col-md-1 badge">Sta</p>
                <p class="col-md-1 badge">En</p>

            </div>
        </div>

     <div class="row">
            <div class="form-group"
                ng-repeat="repType in ent.report">              

                <div class="col-md-3">
                    <input type="radio" class="control-label"     name="reportTypeRadios"
                        ng-value="reportType" ng-if="formName ==      'VIEWEENTITY'"
                           ng-model="$parent.reportTypeRadio" ng-  change="propertyRadioChanged(reportTypeRadio)">
                    {{reportType.reportTypeLabel}} </input>

                           </div>

                         <fieldset ng-disabled="Disabled">

                         <div class="col-md-2">
                           <select class="form-control"
                                ng-model="reportType.conCode">
                               <option value="">Please select</option>
                              <option ng-repeat="conScope in conScopes"
                                value="{{conScope.conCode}}">{{conScope.conLabel}}</option>
                          </select>
                         </div>

                        <div class="col-md-2">
                          <select class="form-control" ng-model="repType.freCode">
                               <option value="">Please select</option>
                               <option ng-repeat="frecy in reportFrncies"
                                  value="{{frequency.frequencyCode}}">  {{frequency.frequencyLabel}}</option>
                          </select>
                        </div>

                       <div class="col-md-1">
                           <datepicker date-format="yyyy-MM-dd"> <input
                            id="{{reportType.reportTypeCodeId}}startDate" type="text"
                               class="form-control" ng-model="reportType.startDate"> </datepicker>


                         </div>

                         <div class="col-md-1">
                          <datepicker date-format="yyyy-MM-dd"> <input
                                 id="{{reportType.reportTypeCodeId}}endDate"   type="text"
                                     class="form-control" ng-  model="reportType.endDate"> </datepicker>

                       </div>                       

               </div>
                 </div>

0 个答案:

没有答案