diff --git a/packages/calcite-components/src/components/dropdown/dropdown.e2e.ts b/packages/calcite-components/src/components/dropdown/dropdown.e2e.ts
index 5631d9ef4e8..67a5f25a116 100644
--- a/packages/calcite-components/src/components/dropdown/dropdown.e2e.ts
+++ b/packages/calcite-components/src/components/dropdown/dropdown.e2e.ts
@@ -58,7 +58,7 @@ describe("calcite-dropdown", () => {
     });
 
     describe("renders", () => {
-      renders(simpleDropdownHTML, { display: "inline-flex" });
+      renders(simpleDropdownHTML, { display: "inline-block" });
     });
 
     describe("honors hidden attribute", () => {
diff --git a/packages/calcite-components/src/components/dropdown/dropdown.scss b/packages/calcite-components/src/components/dropdown/dropdown.scss
index 20184ba91a9..37bf1dd21e6 100644
--- a/packages/calcite-components/src/components/dropdown/dropdown.scss
+++ b/packages/calcite-components/src/components/dropdown/dropdown.scss
@@ -7,7 +7,7 @@
  */
 
 :host {
-  @apply inline-flex flex-initial;
+  @apply inline-block flex-initial;
 }
 
 @include disabled();
diff --git a/packages/calcite-components/src/components/dropdown/dropdown.stories.ts b/packages/calcite-components/src/components/dropdown/dropdown.stories.ts
index 76811abbf26..1d53146e208 100644
--- a/packages/calcite-components/src/components/dropdown/dropdown.stories.ts
+++ b/packages/calcite-components/src/components/dropdown/dropdown.stories.ts
@@ -462,3 +462,21 @@ export const triggerWordBreak_TestOnly = (): string => html`<div style="width:30
   </calcite-dropdown-group>
 </calcite-dropdown>
 </div>`;
+
+export const settingFullWidthEnablesTriggerTruncation_TestOnly = (): string => html`<div
+  style="width: 300px; border: solid"
+>
+  <calcite-dropdown style="width: 100%;">
+    <calcite-button width="full" slot="trigger"
+      >This is some really long text that will eventually overrun the container</calcite-button
+    >
+    <calcite-dropdown-group group-title="Natural places">
+      <calcite-dropdown-item>Mountain</calcite-dropdown-item>
+      <calcite-dropdown-item>River</calcite-dropdown-item>
+      <calcite-dropdown-item>Waterfall</calcite-dropdown-item>
+      <calcite-dropdown-item>Rainforest</calcite-dropdown-item>
+      <calcite-dropdown-item>Tundra</calcite-dropdown-item>
+      <calcite-dropdown-item>Desert</calcite-dropdown-item>
+    </calcite-dropdown-group>
+  </calcite-dropdown>
+</div>`;