diff --git a/src/app/pages/form/inputs/widgets/datePickers/datePickers.html b/src/app/pages/form/inputs/widgets/datePickers/datePickers.html
index c7bf64745..1f48dbc7b 100644
--- a/src/app/pages/form/inputs/widgets/datePickers/datePickers.html
+++ b/src/app/pages/form/inputs/widgets/datePickers/datePickers.html
@@ -1,5 +1,5 @@
 <div class="datepicker row">
-    <div class="col-sm-6" ng-controller="datepickerCtrl">
+    <div class="col-xlg-6 col-md-12 col-sm-6" ng-controller="datepickerCtrl">
         <h4>Inline</h4>
         <label>Selected date is: <em>{{dt | date:'fullDate' }}</em></label>
         <div class="uib-datepicker-wrap">
@@ -7,7 +7,7 @@ <h4>Inline</h4>
         </div>
     </div>
 
-    <div class="col-sm-6" ng-controller="datepickerpopupCtrl">
+    <div class="col-xlg-6 col-md-12 col-sm-6" ng-controller="datepickerpopupCtrl">
         <h4>Popup</h4>
         <label>Selected date is: <em>{{dt | date:'fullDate' }}</em></label>
         <p class="input-group">
diff --git a/src/sass/theme/_datePicker.scss b/src/sass/theme/_datePicker.scss
index 597ad84e1..357c1b28c 100644
--- a/src/sass/theme/_datePicker.scss
+++ b/src/sass/theme/_datePicker.scss
@@ -18,7 +18,6 @@
 }
 
 .uib-datepicker-wrap {
-  display:inline-block;
   min-height:270px;
 }