diff --git a/src/Date/DatePickerInputWithoutModal.tsx b/src/Date/DatePickerInputWithoutModal.tsx
index 36fd0569..2e156814 100644
--- a/src/Date/DatePickerInputWithoutModal.tsx
+++ b/src/Date/DatePickerInputWithoutModal.tsx
@@ -141,15 +141,18 @@ const styles = StyleSheet.create({
     flexGrow: 1,
     justifyContent: 'center',
     alignItems: 'flex-start',
+    width: '100%',
   },
   inputContainer: {
     flexGrow: 1,
     flexDirection: 'row',
     alignItems: 'center',
     justifyContent: 'flex-start',
+    width: '100%',
   },
   input: {
     flexGrow: 1,
+    width: '100%',
   },
 })
 export default React.forwardRef(DatePickerInputWithoutModal)
diff --git a/src/__tests__/Date/__snapshots__/AnimatedCrossView.test.tsx.snap b/src/__tests__/Date/__snapshots__/AnimatedCrossView.test.tsx.snap
index 2de38abd..46bad79b 100644
--- a/src/__tests__/Date/__snapshots__/AnimatedCrossView.test.tsx.snap
+++ b/src/__tests__/Date/__snapshots__/AnimatedCrossView.test.tsx.snap
@@ -3862,6 +3862,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
             "alignItems": "flex-start",
             "flexGrow": 1,
             "justifyContent": "center",
+            "width": "100%",
           }
         }
       >
@@ -3872,6 +3873,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
               "flexDirection": "row",
               "flexGrow": 1,
               "justifyContent": "flex-start",
+              "width": "100%",
             }
           }
         >
@@ -3885,6 +3887,7 @@ exports[`renders collapsed AnimatedCrossView 1`] = `
                 },
                 {
                   "flexGrow": 1,
+                  "width": "100%",
                 },
               ]
             }
diff --git a/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap b/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap
index f6d3db8e..b4af2a91 100644
--- a/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap
+++ b/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap
@@ -14,6 +14,7 @@ exports[`renders CalendarEdit 1`] = `
         "alignItems": "flex-start",
         "flexGrow": 1,
         "justifyContent": "center",
+        "width": "100%",
       }
     }
   >
@@ -24,6 +25,7 @@ exports[`renders CalendarEdit 1`] = `
           "flexDirection": "row",
           "flexGrow": 1,
           "justifyContent": "flex-start",
+          "width": "100%",
         }
       }
     >
@@ -37,6 +39,7 @@ exports[`renders CalendarEdit 1`] = `
             },
             {
               "flexGrow": 1,
+              "width": "100%",
             },
           ]
         }
diff --git a/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap b/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap
index e6a40455..370a0b0e 100644
--- a/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap
+++ b/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap
@@ -7,6 +7,7 @@ exports[`renders DatePickerInput 1`] = `
       "alignItems": "flex-start",
       "flexGrow": 1,
       "justifyContent": "center",
+      "width": "100%",
     }
   }
 >
@@ -17,6 +18,7 @@ exports[`renders DatePickerInput 1`] = `
         "flexDirection": "row",
         "flexGrow": 1,
         "justifyContent": "flex-start",
+        "width": "100%",
       }
     }
   >
@@ -30,6 +32,7 @@ exports[`renders DatePickerInput 1`] = `
           },
           {
             "flexGrow": 1,
+            "width": "100%",
           },
         ]
       }