diff --git a/src/controls/dashboard/widget/IWidget.ts b/src/controls/dashboard/widget/IWidget.ts
index 5023dd36c..8c310c81e 100644
--- a/src/controls/dashboard/widget/IWidget.ts
+++ b/src/controls/dashboard/widget/IWidget.ts
@@ -27,6 +27,7 @@ export enum WidgetSize {
   Single = "single",
   Double = "double",
   Triple = "triple",
+  Quadruple = "quadruple",
   Box = "box",
 }
 
diff --git a/src/controls/dashboard/widget/Widget.tsx b/src/controls/dashboard/widget/Widget.tsx
index 04fb0e37a..5b21d93a8 100644
--- a/src/controls/dashboard/widget/Widget.tsx
+++ b/src/controls/dashboard/widget/Widget.tsx
@@ -15,7 +15,7 @@ export const Widget = ({
         gridColumnEnd: "auto",
         gridRowEnd: "auto",
         "@media (max-width: 842px)": {
-            gridColumnEnd: "span 3",
+            gridColumnEnd: "span 4",
         },
     };
     if (widget.size === WidgetSize.Double) {
@@ -28,6 +28,9 @@ export const Widget = ({
     if (widget.size === WidgetSize.Triple) {
         cardStyle.gridColumnEnd = "span 3";
     }
+    if (widget.size === WidgetSize.Quadruple) {
+        cardStyle.gridColumnEnd = "span 4";
+    }
     if(widget.controlOptions && widget.controlOptions.isHidden){
         return null;
     }
diff --git a/src/webparts/controlsTest/components/ControlsTest.tsx b/src/webparts/controlsTest/components/ControlsTest.tsx
index bb8114ba0..fed1e7738 100644
--- a/src/webparts/controlsTest/components/ControlsTest.tsx
+++ b/src/webparts/controlsTest/components/ControlsTest.tsx
@@ -1992,7 +1992,7 @@ export default class ControlsTest extends React.Component<IControlsTestProps, IC
               title: "Card 1",
               desc: "Last updated Monday, April 4 at 11:15 AM (PT)",
               widgetActionGroup: calloutItemsExample,
-              size: WidgetSize.Triple,
+              size: WidgetSize.Quadruple,
               body: [
                 {
                   id: "t1",