diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4c0c92b4c2..cf0dbaeba6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@
 - Send captured data in `stop_recording` event for `gr.Audio` and `gr.Video` components by [@freddyaboulton](https://github.com/freddyaboulton) in [PR 4554](https://github.com/gradio-app/gradio/pull/4554)
 - Fix bug in `gr.Gallery` where `height` and `object_fit` parameters where being ignored by [@freddyaboulton](https://github.com/freddyaboulton) in [PR 4576](https://github.com/gradio-app/gradio/pull/4576)
 - Fixes an HTML sanitization issue in DOMPurify where links in markdown were not opening in a new window by [@hannahblair] in [PR 4577](https://github.com/gradio-app/gradio/pull/4577)
+- Fixed Dropdown height rendering in Columns by [@aliabid94](https://github.com/aliabid94) in [PR 4584](https://github.com/gradio-app/gradio/pull/4584) 
 
 ## Other Changes:
 
diff --git a/gradio/components/dropdown.py b/gradio/components/dropdown.py
index 0a30634cf5..d61b4456fb 100644
--- a/gradio/components/dropdown.py
+++ b/gradio/components/dropdown.py
@@ -22,13 +22,13 @@ set_documentation_group("component")
 
 @document()
 class Dropdown(
+    FormComponent,
     Changeable,
     Inputable,
     Selectable,
     Blurrable,
     IOComponent,
     SimpleSerializable,
-    FormComponent,
 ):
     """
     Creates a dropdown of choices from which entries can be selected.
diff --git a/js/app/src/components/AnnotatedImage/AnnotatedImage.svelte b/js/app/src/components/AnnotatedImage/AnnotatedImage.svelte
index 6f77a2f795..36843b5e5e 100644
--- a/js/app/src/components/AnnotatedImage/AnnotatedImage.svelte
+++ b/js/app/src/components/AnnotatedImage/AnnotatedImage.svelte
@@ -20,7 +20,7 @@
 	export let width: number | undefined;
 	export let color_map: Record<string, string>;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let root: string;
 	export let root_url: string;
diff --git a/js/app/src/components/Audio/Audio.svelte b/js/app/src/components/Audio/Audio.svelte
index 0d8019a9c9..1ffc50ee0b 100644
--- a/js/app/src/components/Audio/Audio.svelte
+++ b/js/app/src/components/Audio/Audio.svelte
@@ -32,7 +32,7 @@
 	export let streaming: boolean;
 	export let root_url: null | string;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 	export let autoplay: boolean = false;
diff --git a/js/app/src/components/Button/Button.svelte b/js/app/src/components/Button/Button.svelte
index c7a8c73e0a..5c278c1b52 100644
--- a/js/app/src/components/Button/Button.svelte
+++ b/js/app/src/components/Button/Button.svelte
@@ -9,7 +9,7 @@
 	export let variant: "primary" | "secondary" | "stop" = "secondary";
 	export let mode: "static" | "dynamic" = "dynamic";
 	export let size: "sm" | "lg" = "lg";
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 </script>
 
diff --git a/js/app/src/components/Chatbot/Chatbot.svelte b/js/app/src/components/Chatbot/Chatbot.svelte
index 53446b9b6a..08cd091d87 100644
--- a/js/app/src/components/Chatbot/Chatbot.svelte
+++ b/js/app/src/components/Chatbot/Chatbot.svelte
@@ -21,7 +21,7 @@
 		display: boolean;
 	}>;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let label: string;
 	export let show_label: boolean = true;
diff --git a/js/app/src/components/Checkbox/Checkbox.svelte b/js/app/src/components/Checkbox/Checkbox.svelte
index b55dc1f917..34cd6adb30 100644
--- a/js/app/src/components/Checkbox/Checkbox.svelte
+++ b/js/app/src/components/Checkbox/Checkbox.svelte
@@ -13,7 +13,7 @@
 	export let info: string | undefined = undefined;
 	export let mode: "static" | "dynamic";
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 </script>
diff --git a/js/app/src/components/CheckboxGroup/CheckboxGroup.svelte b/js/app/src/components/CheckboxGroup/CheckboxGroup.svelte
index 4316ddefb4..e2774b3793 100644
--- a/js/app/src/components/CheckboxGroup/CheckboxGroup.svelte
+++ b/js/app/src/components/CheckboxGroup/CheckboxGroup.svelte
@@ -11,7 +11,7 @@
 	export let value_is_output: boolean = false;
 	export let choices: Array<string>;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let mode: "static" | "dynamic";
 	export let label: string = "Checkbox Group";
diff --git a/js/app/src/components/ColorPicker/ColorPicker.svelte b/js/app/src/components/ColorPicker/ColorPicker.svelte
index b7a78579d2..dc6ffc4111 100644
--- a/js/app/src/components/ColorPicker/ColorPicker.svelte
+++ b/js/app/src/components/ColorPicker/ColorPicker.svelte
@@ -15,7 +15,7 @@
 	export let value_is_output: boolean = false;
 	export let show_label: boolean;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 	export let mode: "static" | "dynamic";
diff --git a/js/app/src/components/Column/Column.svelte b/js/app/src/components/Column/Column.svelte
index 06035179c7..24395ada6d 100644
--- a/js/app/src/components/Column/Column.svelte
+++ b/js/app/src/components/Column/Column.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let gap: boolean = true;
 	export let min_width: number = 0;
 	export let elem_id: string = "";
diff --git a/js/app/src/components/DataFrame/DataFrame.svelte b/js/app/src/components/DataFrame/DataFrame.svelte
index c2329be183..37a23f341d 100644
--- a/js/app/src/components/DataFrame/DataFrame.svelte
+++ b/js/app/src/components/DataFrame/DataFrame.svelte
@@ -25,7 +25,7 @@
 	export let label: string | null = null;
 	export let wrap: boolean;
 	export let datatype: Datatype | Array<Datatype>;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 
 	const dispatch = createEventDispatcher();
diff --git a/js/app/src/components/Dataset/Dataset.svelte b/js/app/src/components/Dataset/Dataset.svelte
index f6a1190184..29fd7e1946 100644
--- a/js/app/src/components/Dataset/Dataset.svelte
+++ b/js/app/src/components/Dataset/Dataset.svelte
@@ -16,7 +16,7 @@
 	export let root: string;
 	export let root_url: null | string;
 	export let samples_per_page: number = 10;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 
 	const dispatch = createEventDispatcher<{
diff --git a/js/app/src/components/Dropdown/Dropdown.svelte b/js/app/src/components/Dropdown/Dropdown.svelte
index f6613b9736..6b6a379f73 100644
--- a/js/app/src/components/Dropdown/Dropdown.svelte
+++ b/js/app/src/components/Dropdown/Dropdown.svelte
@@ -16,7 +16,7 @@
 	export let choices: Array<string>;
 	export let show_label: boolean;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 	export let allow_custom_value: boolean = false;
diff --git a/js/app/src/components/File/File.svelte b/js/app/src/components/File/File.svelte
index ac80e6639f..c75410487b 100644
--- a/js/app/src/components/File/File.svelte
+++ b/js/app/src/components/File/File.svelte
@@ -28,7 +28,7 @@
 	export let selectable: boolean = false;
 	export let loading_status: LoadingStatus;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 
 	$: _value = normalise_file(value, root, root_url);
diff --git a/js/app/src/components/Form/Form.svelte b/js/app/src/components/Form/Form.svelte
index 317eeb0ae7..d8bc276de1 100644
--- a/js/app/src/components/Form/Form.svelte
+++ b/js/app/src/components/Form/Form.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	export let visible = true;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number = 0;
 </script>
 
diff --git a/js/app/src/components/Gallery/Gallery.svelte b/js/app/src/components/Gallery/Gallery.svelte
index 287362b509..589e912abb 100644
--- a/js/app/src/components/Gallery/Gallery.svelte
+++ b/js/app/src/components/Gallery/Gallery.svelte
@@ -15,7 +15,7 @@
 	export let visible: boolean = true;
 	export let value: Array<string> | Array<FileData> | null = null;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let grid_cols: number | Array<number> | undefined = [2];
 	export let grid_rows: number | Array<number> | undefined = undefined;
diff --git a/js/app/src/components/HighlightedText/HighlightedText.svelte b/js/app/src/components/HighlightedText/HighlightedText.svelte
index 52c8525f99..47c980f214 100644
--- a/js/app/src/components/HighlightedText/HighlightedText.svelte
+++ b/js/app/src/components/HighlightedText/HighlightedText.svelte
@@ -15,7 +15,7 @@
 	export let color_map: Record<string, string> = {};
 	export let label: string = "Highlighted Text";
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let selectable: boolean = false;
 
diff --git a/js/app/src/components/Image/Image.svelte b/js/app/src/components/Image/Image.svelte
index b99bb310e1..854fbb30c7 100644
--- a/js/app/src/components/Image/Image.svelte
+++ b/js/app/src/components/Image/Image.svelte
@@ -24,7 +24,7 @@
 	export let brush_radius: number;
 	export let selectable: boolean = false;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 	export let mode: "static" | "dynamic";
diff --git a/js/app/src/components/Json/Json.svelte b/js/app/src/components/Json/Json.svelte
index 69c5d538df..aee70fa641 100644
--- a/js/app/src/components/Json/Json.svelte
+++ b/js/app/src/components/Json/Json.svelte
@@ -17,7 +17,7 @@
 	export let label: string;
 	export let show_label: boolean;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 
 	const dispatch = createEventDispatcher<{ change: undefined }>();
diff --git a/js/app/src/components/Label/Label.svelte b/js/app/src/components/Label/Label.svelte
index cd83157773..82b91f3ae4 100644
--- a/js/app/src/components/Label/Label.svelte
+++ b/js/app/src/components/Label/Label.svelte
@@ -16,7 +16,7 @@
 	} = {};
 	export let label: string = "Label";
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 	export let show_label: boolean;
diff --git a/js/app/src/components/Model3D/Model3D.svelte b/js/app/src/components/Model3D/Model3D.svelte
index 45ccefd25d..467f2ab0c2 100644
--- a/js/app/src/components/Model3D/Model3D.svelte
+++ b/js/app/src/components/Model3D/Model3D.svelte
@@ -22,7 +22,7 @@
 	export let label: string;
 	export let show_label: boolean;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 
 	let _value: null | FileData;
diff --git a/js/app/src/components/Number/Number.svelte b/js/app/src/components/Number/Number.svelte
index 2afdaf4bda..d0d7077535 100644
--- a/js/app/src/components/Number/Number.svelte
+++ b/js/app/src/components/Number/Number.svelte
@@ -10,7 +10,7 @@
 	export let elem_classes: Array<string> = [];
 	export let visible: boolean = true;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let value: number = 0;
 	export let show_label: boolean;
diff --git a/js/app/src/components/Plot/Plot.svelte b/js/app/src/components/Plot/Plot.svelte
index 644d078458..996412a21d 100644
--- a/js/app/src/components/Plot/Plot.svelte
+++ b/js/app/src/components/Plot/Plot.svelte
@@ -18,7 +18,7 @@
 	export let show_label: boolean;
 	export let target: HTMLElement;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let theme_mode: ThemeMode;
 	export let caption: string;
diff --git a/js/app/src/components/Radio/Radio.svelte b/js/app/src/components/Radio/Radio.svelte
index 7525b2dd56..09ca536488 100644
--- a/js/app/src/components/Radio/Radio.svelte
+++ b/js/app/src/components/Radio/Radio.svelte
@@ -15,7 +15,7 @@
 	export let mode: "static" | "dynamic";
 	export let show_label: boolean;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 </script>
diff --git a/js/app/src/components/Slider/Slider.svelte b/js/app/src/components/Slider/Slider.svelte
index d00ae850c4..bf49ff3add 100644
--- a/js/app/src/components/Slider/Slider.svelte
+++ b/js/app/src/components/Slider/Slider.svelte
@@ -11,7 +11,7 @@
 	export let label: string = "Slider";
 	export let info: string | undefined = undefined;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let minimum: number;
 	export let maximum: number;
diff --git a/js/app/src/components/Textbox/Textbox.svelte b/js/app/src/components/Textbox/Textbox.svelte
index d292b864d8..0b465ec3ac 100644
--- a/js/app/src/components/Textbox/Textbox.svelte
+++ b/js/app/src/components/Textbox/Textbox.svelte
@@ -18,7 +18,7 @@
 	export let max_lines: number | false;
 	export let type: "text" | "password" | "email" = "text";
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let show_copy_button: boolean = false;
 	export let loading_status: LoadingStatus | undefined = undefined;
diff --git a/js/app/src/components/TimeSeries/TimeSeries.svelte b/js/app/src/components/TimeSeries/TimeSeries.svelte
index 6a226a6e03..43b4b9c437 100644
--- a/js/app/src/components/TimeSeries/TimeSeries.svelte
+++ b/js/app/src/components/TimeSeries/TimeSeries.svelte
@@ -43,7 +43,7 @@
 	export let show_label: boolean;
 	export let colors: Array<string>;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let loading_status: LoadingStatus;
 
diff --git a/js/app/src/components/UploadButton/UploadButton.svelte b/js/app/src/components/UploadButton/UploadButton.svelte
index 0be715de5e..2071c4970b 100644
--- a/js/app/src/components/UploadButton/UploadButton.svelte
+++ b/js/app/src/components/UploadButton/UploadButton.svelte
@@ -15,7 +15,7 @@
 	export let file_types: Array<string> = ["file"];
 	export let root: string;
 	export let size: "sm" | "lg" = "lg";
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let mode: "static" | "dynamic" = "dynamic";
 	export let variant: "primary" | "secondary" | "stop" = "secondary";
diff --git a/js/app/src/components/Video/Video.svelte b/js/app/src/components/Video/Video.svelte
index 4b02b741dd..5972d47fa3 100644
--- a/js/app/src/components/Video/Video.svelte
+++ b/js/app/src/components/Video/Video.svelte
@@ -27,7 +27,7 @@
 	export let mirror_webcam: boolean;
 	export let include_audio: boolean;
 	export let container: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let mode: "static" | "dynamic";
 	export let autoplay: boolean = false;
diff --git a/js/button/src/Button.svelte b/js/button/src/Button.svelte
index 925a182b1e..be46eae1ab 100644
--- a/js/button/src/Button.svelte
+++ b/js/button/src/Button.svelte
@@ -5,7 +5,7 @@
 	export let variant: "primary" | "secondary" | "stop" = "secondary";
 	export let size: "sm" | "lg" = "lg";
 	export let disabled: boolean = false;
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 </script>
 
diff --git a/js/upload-button/src/UploadButton.svelte b/js/upload-button/src/UploadButton.svelte
index e51e2da5b2..5805251ece 100644
--- a/js/upload-button/src/UploadButton.svelte
+++ b/js/upload-button/src/UploadButton.svelte
@@ -10,7 +10,7 @@
 	export let file_types: Array<string> = ["file"];
 	export let include_file_metadata = true;
 	export let size: "sm" | "lg" = "lg";
-	export let scale: number = 1;
+	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let mode: "static" | "dynamic" = "dynamic";
 	export let variant: "primary" | "secondary" | "stop" = "secondary";
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 80d2c78e21..137854c05c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,4 +1,4 @@
-lockfileVersion: '6.0'
+lockfileVersion: '6.1'
 
 settings:
   autoInstallPeers: true