diff --git a/src/components/tasks/GanttChart.vue b/src/components/tasks/GanttChart.vue
index 154f89385..d536c6467 100644
--- a/src/components/tasks/GanttChart.vue
+++ b/src/components/tasks/GanttChart.vue
@@ -3,7 +3,7 @@
v-if="props.isLoading && !ganttBars.length || dayjsLanguageLoading"
class="gantt-container"
/>
-
+
new Date(new Date(filters.value.dateFrom).setHours(0,0,0,0)))
@@ -92,9 +94,15 @@ const dateToDate = computed(() => new Date(new Date(filters.value.dateTo).setHou
const DAY_WIDTH_PIXELS = 30
const ganttChartWidth = computed(() => {
- const dateDiff = Math.floor((dateToDate.value.valueOf() - dateFromDate.value.valueOf()) / MILLISECONDS_A_DAY)
- return dateDiff * DAY_WIDTH_PIXELS
+ const ganttContainerReference = ganttContainer?.value
+ const ganttContainerWidth = ganttContainerReference ? (ganttContainerReference['clientWidth'] ?? 0) : 0
+
+ const dateDiff = Math.floor((dateToDate.value.valueOf() - dateFromDate.value.valueOf()) / MILLISECONDS_A_DAY)
+ const calculatedWidth = dateDiff * DAY_WIDTH_PIXELS
+
+ return (calculatedWidth > ganttContainerWidth) ? calculatedWidth + 'px' : '100%'
+
})
const ganttBars = ref([])