diff --git a/apps/web/src/components/forms/poll-options-form/month-calendar/month-calendar.tsx b/apps/web/src/components/forms/poll-options-form/month-calendar/month-calendar.tsx
index 52891b448..0c43afc5d 100644
--- a/apps/web/src/components/forms/poll-options-form/month-calendar/month-calendar.tsx
+++ b/apps/web/src/components/forms/poll-options-form/month-calendar/month-calendar.tsx
@@ -95,7 +95,7 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
 
   return (
     <div className="overflow-hidden md:flex">
-      <div className="grow border-b p-3 sm:p-4 md:border-b-0 md:border-r">
+      <div className="border-b p-3 sm:p-4 md:basis-[420px] md:border-b-0 md:border-r">
         <div>
           <div className="flex w-full flex-col">
             <div className="mb-3 flex items-center justify-center space-x-4">
@@ -207,7 +207,7 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
           </div>
         </div>
       </div>
-      <div className="flex  flex-col md:w-[380px]">
+      <div className="flex grow flex-col">
         <div
           className={clsx("border-b", {
             hidden: datepicker.selection.length === 0,