title: Bootstrap Date picker at unusual position
body: <p>I am using a checkbox for toggling between datepicker and monthpicker. Its working fine if I open them one at a time (i.e close one before toggling). But if I toggle the checkbox while the datepicker/monthpicker is still open, then the new popup is opening at a wrong position.</p>
  
  <p>I don't know what i am doing wrong. I have not worked on css before. </p>
  
  <p><strong>for datepicker</strong></p>
  
  <p><a href="https://i.stack.imgur.com/5Avqk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5Avqk.png" alt="enter image description here"></a></p>
  
  <p><strong>and this is where it's going for a picnic</strong></p>
  
  <p><a href="https://i.stack.imgur.com/8aiWk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8aiWk.png" alt="enter image description here"></a></p>
  
  <p>This is my HTML:</p>
  
  <pre><code>&lt;div class="span3 custom-style-datepicker" ng-if="permission" &gt;
     &lt;label class="control-label" translate="date"&gt;&lt;/label&gt;
     &lt;div class="span4" ng-show="reconModel.isEnabled"&gt;
        &lt;input type="text" class="form-control recon-date" datepicker-popup="MM/dd/yyyy" ng-model="vm.reconModel.date" is-open="isFromOpen" show-weeks="false" ng-click="isFromOpen=!isToOpen" min-mode="'month'" datepicker-mode="'month'" /&gt;
     &lt;/div&gt;
     &lt;div id="here" class="span4" ng-show="!reconModel.isEnabled"&gt;
        &lt;input type="text" class="form-control recon-date" datepicker-popup="MM/dd/yyyy" ng-model="vm.reconModel.date" is-open="isFromOpen" ng-click="isFromOpen=!isToOpen" show-weeks="false"  /&gt;
     &lt;/div&gt;
     &lt;div class="switchable-dp " style="padding: 1px 0px 0px 0px"&gt;
        &lt;input type="checkbox" name="isEnabled" ng-true-value="true" ng-false-value="false" switch-active="{{permission}}" switch-on-text="Month Picker" switch-off-text="Date Picker" switch-off-color="success" switch-label="" switch-radio-off="{{permission}}" ng-init="reconModel.isEnabled=true" ng-model="reconModel.isEnabled" switch-size="mini" bs-switch  data-label-width="0"&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>