diff --git a/packages/web-components/src/components/callout-quote/__stories__/callout-quote.stories.ts b/packages/web-components/src/components/callout-quote/__stories__/callout-quote.stories.ts
index a07746340ee..d02c457cd70 100644
--- a/packages/web-components/src/components/callout-quote/__stories__/callout-quote.stories.ts
+++ b/packages/web-components/src/components/callout-quote/__stories__/callout-quote.stories.ts
@@ -50,7 +50,7 @@ export default {
     (story) => html`
       <div class="bx--grid">
         <div class="bx--row">
-          <div class="bx--col-lg-11">${story()}</div>
+          <div class="bx--offset-lg-4 bx--col-lg-12">${story()}</div>
         </div>
       </div>
     `,
diff --git a/packages/web-components/src/components/callout-quote/callout-quote.scss b/packages/web-components/src/components/callout-quote/callout-quote.scss
index 69e28c87f5d..2241171307e 100644
--- a/packages/web-components/src/components/callout-quote/callout-quote.scss
+++ b/packages/web-components/src/components/callout-quote/callout-quote.scss
@@ -33,3 +33,18 @@
     margin: 1rem 0.5rem;
   }
 }
+
+:host(#{$dds-prefix}-callout-quote) {
+  .#{$prefix}--quote__wrapper {
+    margin-left: -$spacing-05;
+    margin-right: -$spacing-05;
+    @include carbon--breakpoint('md') {
+      margin-left: -$spacing-05;
+      margin-right: -$spacing-05;
+    }
+    @include carbon--breakpoint('sm') {
+      margin-left: 0;
+      margin-right: 0;
+    }
+  }
+}