HI У меня есть такое требование. ![enter image description here](https://i.stack.imgur.com/m73nP.png)
Я буду активировать поле информации LCM на флажке LCM.Ниже мой код.
<div class="panel-body ">
<div class="col-md-4 col-sm-4 col-xs-12 "></div>
<div class="col-md-4 col-sm-4 col-xs-12 ">
<input type="checkbox" id="validationTypeFunctional" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="Functional"/>
<label>Functional</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12" >
<div class="col-sm-6 col-xs-12 required">
<label class="control-label">LCM Deployment</label>
<select class="form-control" id="lcmDeployment" >
<option value="" >Please Select an option</option>
<option value="With Orchestration"> With Orchestration</option>
<option value="Without Orchestration">Without Orchestration</option>
</select>
</div>
<div class="col-sm-6 col-xs-12 required">
<label class="control-label">Workflow Type</label>
<select class="form-control" id="workflowType" >
<option value="" >Please Select an option</option>
<option value="Legacy">Legacy(Hot)</option>
<option value="Tosca">Tosca</option>
</select>
</div>
<div class="col-sm-6 col-xs-12 ">
<label class="control-label">Verified Workflows</label>
<input type="text" class="form-control" id="verifiedWorkflow"/>
</div>
<div class="col-sm-6 col-xs-12 ">
<label class="control-label">Workflow RPM-Package</label>
<input type="text" class="form-control" id="workflowRPMPackage"/>
</div>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 ">
<input type="checkbox" id="validationTypeCertification" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="Certification"/>
<label style="font-weight:bold">Certification</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 ">
<input type="checkbox" id="validationTypeLCM" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="LCM" />
<label>LCM</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12">
<input type="checkbox" id="validationTypePerformance" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="Performance" />
<label>Performance</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 ">
<input type="checkbox" id="validationTypeSystemVerification" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="System verification" />
<label style="font-weight:bold">System verification</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 ">
<input type="checkbox" id="validationTypeResilience" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="Resilience" />
<label>Resilience</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 ">
<input type="checkbox" id="validationTypeSecurity" name="validationTypesDone" style="width:15px;height:15px;margin-right:20px" value="Security" />
<label>Security</label>
</div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12 "> </div>
<div class="col-md-4 col-sm-4 col-xs-12">
<label class="control-label">Validation Results</label>
<!--<input type="text" class="form-control">-->
<select class="form-control" id="validationResults" >
<option value=" " >Please select an option</option>
<option value="Completed" >Completed</option>
<option value="Completed with restrictions">Completed with restrcitions</option>
<option value="Incompatible" >Incompatible</option>
</select>
</div>
</div>
</div>
Но выравнивание некорректно. Я не могу объединить / объединить строки в столбце. Он отображается только в одной строке, и выравнивание нарушено.
Нужна помощь в получении желаемого результата.