title: How to keep row position same when zoom your browser more than 100% using Bootstrap?
body: <p>I have small issue with bootstrap grid system , I have a row that has grid setup with two sections with col-md-6 , Now problem is when i zoom my browser more than 100% my Close label and input is moving to next line. I want them to stay same place all the time zoom should not effect the position of the rows.I tried to use col-xs-1 but it does not work. How can i achieve that task using bootstrap ?</p>
  
  <p>main.html</p>
  
  <pre><code>&lt;div class="row"&gt;
                  &lt;div class="container col-md-6"&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label class="col-md-5"&gt;Actual Cycle Start:&lt;/label&gt;
                          &lt;div class="col-md-7"&gt;
                              &lt;div class="row"&gt;
                                  &lt;div class="col-xs-5"&gt;
                                      &lt;input class="form-control" ng-model="riskAssessmentDTO.cycleStartDate"
                                           k-format="'MM/dd/yyyy'" disabled /&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-xs-1"&gt;
                                      &lt;label class="control-label"&gt; Close:&lt;/label&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-md-5 changeWdh"&gt;
                                      &lt;input class="form-control" ng-model="riskAssessmentDTO.cycleEndDate" k-format="'MM/dd/yyyy'" disabled /&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="form-group col-md-6 fieldHeight"&gt;
                      &lt;label for="challengeOutstand" class="col-md-5"&gt;Challenges
                          Outstanding:&lt;/label&gt;
                      &lt;div class="col-md-7"&gt;
                          &lt;input type="text" class="form-control" id="challengeOutstand"
                              name="challengeOutstand" maxlength="256"
                              ng-model="riskAssessmentDTO.challengesOutstanding" disabled /&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
              &lt;/div&gt;
  </code></pre>
  
  <p>main.css</p>
  
  <pre><code>.changeWdh{  
      width: 152px;
  }
  </code></pre>