Angular ngx-boostrap datepicker position issue on mobile screen

ngx-bootstrap/datepicker is working fine when larger screen but not in mobile screens. Need help.



But when I reduce the screen size to mobile (also on actual mobile devices), it opens in wrong position.



ngx-bootstrap/datepicker version 5.3.2

"ngx-bootstrap": "^5.3.2",

This is how I am using that in the template.

<div class="row">
<div class="col-xs-12 col-12 col-md-6 form-group">
<input type="text"
class="form-control"
style="cursor: pointer"
readonly="true"
[minDate]="minDate"
[maxDate]="dt"
#dp="bsDatepicker"
bsDatepicker [(bsValue)]="bsValue"
(bsValueChange)="UpdateDashboard()">
</div>
</div>

Continue reading...