diff --git a/client/res/templates/dashboard.tpl b/client/res/templates/dashboard.tpl
index e56a7a09cb..16650001d1 100644
--- a/client/res/templates/dashboard.tpl
+++ b/client/res/templates/dashboard.tpl
@@ -23,5 +23,5 @@
         </div>
     </div>
 </div>
-<div class="dashlets grid-stack grid-stack-4">{{{dashlets}}}</div>
+<div class="dashlets grid-stack grid-stack-12">{{{dashlets}}}</div>
 
diff --git a/client/res/templates/settings/fields/dashboard-layout/detail.tpl b/client/res/templates/settings/fields/dashboard-layout/detail.tpl
index 4534610894..6411705045 100644
--- a/client/res/templates/settings/fields/dashboard-layout/detail.tpl
+++ b/client/res/templates/settings/fields/dashboard-layout/detail.tpl
@@ -14,4 +14,4 @@
 </div>
 
 
-<div class="grid-stack grid-stack-4"></div>
\ No newline at end of file
+<div class="grid-stack grid-stack-12"></div>
\ No newline at end of file
diff --git a/client/res/templates/settings/fields/dashboard-layout/edit.tpl b/client/res/templates/settings/fields/dashboard-layout/edit.tpl
index a1990ef7fc..42d07d5ccc 100644
--- a/client/res/templates/settings/fields/dashboard-layout/edit.tpl
+++ b/client/res/templates/settings/fields/dashboard-layout/edit.tpl
@@ -13,4 +13,4 @@
 </div>
 
 
-<div class="grid-stack grid-stack-4"></div>
\ No newline at end of file
+<div class="grid-stack grid-stack-12"></div>
\ No newline at end of file
diff --git a/client/src/views/dashboard.js b/client/src/views/dashboard.js
index 06c2d7a0d3..838831243e 100644
--- a/client/src/views/dashboard.js
+++ b/client/src/views/dashboard.js
@@ -36,6 +36,8 @@ define('views/dashboard', ['view', 'lib!gridstack'], function (Dep, Gridstack) {
 
         currentTab: null,
 
+        WIDTH_MULTIPLIER: 3,
+
         events: {
             'click button[data-action="selectTab"]': function (e) {
                 var tab = parseInt($(e.currentTarget).data('tab'));
@@ -398,7 +400,7 @@ define('views/dashboard', ['view', 'lib!gridstack'], function (Dep, Gridstack) {
                 {
                     cellHeight: this.getThemeManager().getParam('dashboardCellHeight'),
                     verticalMargin: this.getThemeManager().getParam('dashboardCellMargin'),
-                    column: 4,
+                    column: 12,
                     handle: '.dashlet-container .panel-heading',
                     disableDrag: disableDrag,
                     disableResize: disableResize,
@@ -419,9 +421,9 @@ define('views/dashboard', ['view', 'lib!gridstack'], function (Dep, Gridstack) {
                 grid.addWidget(
                     $item.get(0),
                     {
-                        x: o.x,
+                        x: o.x * this.WIDTH_MULTIPLIER,
                         y: o.y,
-                        width: o.width,
+                        width: o.width * this.WIDTH_MULTIPLIER,
                         height: o.height,
                     }
                 );
@@ -476,9 +478,9 @@ define('views/dashboard', ['view', 'lib!gridstack'], function (Dep, Gridstack) {
                 return {
                     id: $el.data('id'),
                     name: $el.data('name'),
-                    x: node.x,
+                    x: node.x / this.WIDTH_MULTIPLIER,
                     y: node.y,
-                    width: node.width,
+                    width: node.width / this.WIDTH_MULTIPLIER,
                     height: node.height,
                 };
             });
@@ -602,9 +604,9 @@ define('views/dashboard', ['view', 'lib!gridstack'], function (Dep, Gridstack) {
             this.grid.addWidget(
                 $item.get(0),
                 {
-                    x: 0,
+                    x: 0 * this.WIDTH_MULTIPLIER,
                     y: 0,
-                    width: 2,
+                    width: 2 * this.WIDTH_MULTIPLIER,
                     height: 2,
                 }
             );
diff --git a/client/src/views/settings/fields/dashboard-layout.js b/client/src/views/settings/fields/dashboard-layout.js
index 3e68ff1c8a..5c01a87e58 100644
--- a/client/src/views/settings/fields/dashboard-layout.js
+++ b/client/src/views/settings/fields/dashboard-layout.js
@@ -36,6 +36,8 @@ define('views/settings/fields/dashboard-layout', ['views/fields/base', 'lib!grid
 
         validationElementSelector: 'button[data-action="addDashlet"]',
 
+        WIDTH_MULTIPLIER: 3,
+
         events: {
             'click button[data-action="selectTab"]': function (e) {
                 var tab = parseInt($(e.currentTarget).data('tab'));
@@ -130,9 +132,9 @@ define('views/settings/fields/dashboard-layout', ['views/fields/base', 'lib!grid
             this.grid.addWidget(
                 $item.get(0),
                 {
-                    x: 0,
+                    x: 0 * this.WIDTH_MULTIPLIER,
                     y: 0,
-                    width: 2,
+                    width: 2 * this.WIDTH_MULTIPLIER,
                     height: 2,
                 }
             );
@@ -308,9 +310,9 @@ define('views/settings/fields/dashboard-layout', ['views/fields/base', 'lib!grid
                 return {
                     id: $el.data('id'),
                     name: $el.data('name'),
-                    x: node.x,
+                    x: node.x / this.WIDTH_MULTIPLIER,
                     y: node.y,
-                    width: node.width,
+                    width: node.width / this.WIDTH_MULTIPLIER,
                     height: node.height,
                 };
             });
@@ -328,7 +330,7 @@ define('views/settings/fields/dashboard-layout', ['views/fields/base', 'lib!grid
                     minWidth: 4,
                     cellHeight: 60,
                     verticalMargin: 10,
-                    column: 4,
+                    column: 12,
                     resizable: {
                         handles: 'se',
                         helper: false
@@ -347,9 +349,9 @@ define('views/settings/fields/dashboard-layout', ['views/fields/base', 'lib!grid
                     this.grid.addWidget(
                         $item.get(0),
                         {
-                            x: o.x,
+                            x: o.x * this.WIDTH_MULTIPLIER,
                             y: o.y,
-                            width: o.width,
+                            width: o.width * this.WIDTH_MULTIPLIER,
                             height: o.height,
                         }
                     );