diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/CountryPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/CountryPickerDropdownButton.tsx
index 089f77693..a6bba60c6 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/CountryPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/CountryPickerDropdownButton.tsx
@@ -120,6 +120,7 @@ export const CountryPickerDropdownButton = ({
 
   return (
     <Dropdown
+      dropdownMenuWidth={'100%'}
       dropdownId="country-picker-dropdown-id"
       dropdownHotkeyScope={{ scope: CountryPickerHotkeyScope.CountryPicker }}
       clickableComponent={
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index 57c00af8d..6d303a54c 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -33,7 +33,7 @@ type DropdownProps = {
   dropdownHotkeyScope: HotkeyScope;
   dropdownId: string;
   dropdownPlacement?: Placement;
-  dropdownMenuWidth?: `${string}px` | 'auto' | number;
+  dropdownMenuWidth?: `${string}px` | `${number}%` | 'auto' | number;
   dropdownOffset?: { x?: number; y?: number };
   onClickOutside?: () => void;
   onClose?: () => void;
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenu.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenu.tsx
index cee912701..8dc52fabe 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenu.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenu.tsx
@@ -2,7 +2,7 @@ import styled from '@emotion/styled';
 
 const StyledDropdownMenu = styled.div<{
   disableBlur?: boolean;
-  width?: `${string}px` | 'auto' | number;
+  width?: `${string}px` | `${number}%` | 'auto' | number;
 }>`
   backdrop-filter: ${({ disableBlur }) => (disableBlur ? 'none' : 'blur(8px)')};
   background: ${({ theme }) => theme.background.transparent.secondary};