diff --git a/docs/components/dropdown.md b/docs/components/dropdown.md
index 110003ca..844a5c23 100644
--- a/docs/components/dropdown.md
+++ b/docs/components/dropdown.md
@@ -23,16 +23,68 @@ The dropdown component can be used to show a list of menu items when clicking on
 ```vue
 <template>
   <fwb-dropdown text="Bottom">
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
   <fwb-dropdown placement="top" text="Top">
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
   <fwb-dropdown placement="right" text="Right">
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
   <fwb-dropdown placement="left" text="Left">
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
 </template>
 
@@ -49,16 +101,68 @@ The property controls how the dropdown is aligned with the trigger
 ```vue
 <template>
   <fwb-dropdown text="Bottom" align-to-end>
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
   <fwb-dropdown placement="top" text="Top" align-to-end>
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
   <fwb-dropdown placement="right" text="Right" align-to-end>
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
   <fwb-dropdown placement="left" text="Left" align-to-end>
-    <p class="p-2">Dropdown content here</p>
+    <div class="w-52">
+      <p class="p-2">
+        Dropdown content line one
+      </p>
+      <p class="p-2">
+        Dropdown content line two
+      </p>
+      <p class="p-2">
+        Dropdown content line three
+      </p>
+      <p class="p-2">
+        Dropdown content line four
+      </p>
+    </div>
   </fwb-dropdown>
 </template>
 
diff --git a/docs/components/dropdown/examples/FwbDropdownExampleAlignment.vue b/docs/components/dropdown/examples/FwbDropdownExampleAlignment.vue
index d5d36747..7444728a 100644
--- a/docs/components/dropdown/examples/FwbDropdownExampleAlignment.vue
+++ b/docs/components/dropdown/examples/FwbDropdownExampleAlignment.vue
@@ -5,35 +5,79 @@
       text="Top"
       align-to-end
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
     <fwb-dropdown
       placement="right"
       text="Right"
       align-to-end
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
     <fwb-dropdown
       text="Bottom"
       align-to-end
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
     <fwb-dropdown
       placement="left"
       text="Left"
       align-to-end
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
   </div>
 </template>
diff --git a/docs/components/dropdown/examples/FwbDropdownExamplePlacement.vue b/docs/components/dropdown/examples/FwbDropdownExamplePlacement.vue
index 223e12a2..62d7b385 100644
--- a/docs/components/dropdown/examples/FwbDropdownExamplePlacement.vue
+++ b/docs/components/dropdown/examples/FwbDropdownExamplePlacement.vue
@@ -4,30 +4,74 @@
       placement="top"
       text="Top"
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
     <fwb-dropdown
       placement="right"
       text="Right"
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
     <fwb-dropdown text="Bottom">
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
     <fwb-dropdown
       placement="left"
       text="Left"
     >
-      <p class="p-2">
-        Dropdown content here
-      </p>
+      <div class="w-52">
+        <p class="p-2">
+          Dropdown content line one
+        </p>
+        <p class="p-2">
+          Dropdown content line two
+        </p>
+        <p class="p-2">
+          Dropdown content line three
+        </p>
+        <p class="p-2">
+          Dropdown content line four
+        </p>
+      </div>
     </fwb-dropdown>
   </div>
 </template>