diff --git a/frontend/src/app/ntt-gantt/ntt-gantt.component.css b/frontend/src/app/ntt-gantt/ntt-gantt.component.css
index a2f07eb..5f22f1d 100644
--- a/frontend/src/app/ntt-gantt/ntt-gantt.component.css
+++ b/frontend/src/app/ntt-gantt/ntt-gantt.component.css
@@ -437,4 +437,12 @@
 
 ::ng-deep .mat-calendar-cell-content{
    color: #d56100;
-} */
\ No newline at end of file
+} */
+
+.gantt-container {
+  height: 75vh; /* Höhe relativ zur Viewport-Höhe */
+}
+:host {
+  display: block;
+  height: 100%; /* Die Komponente füllt den verfügbaren Raum des übergeordneten Containers */
+}
diff --git a/frontend/src/app/ntt-gantt/ntt-gantt.component.html b/frontend/src/app/ntt-gantt/ntt-gantt.component.html
index ba90d4b..8fa1439 100644
--- a/frontend/src/app/ntt-gantt/ntt-gantt.component.html
+++ b/frontend/src/app/ntt-gantt/ntt-gantt.component.html
@@ -151,7 +151,9 @@
 
 
 <!-- <button ejs-button id='filterRecord' (click)='filter()'>Filter</button> -->
+ <div class="gantt-container">
 <ejs-gantt *ngIf="renderGantt" #ganttObject id="ganttDefault" [enableVirtualization]="true"
+  height="100%"
   [ngStyle]="{'visibility':spin ? 'hidden' : 'visible'}" [dataSource]="data" [allowSorting]='true'
   [resources]="resources" [taskFields]="taskSettings" [resourceFields]="resourceFields" [editSettings]="editSettings"
   [columns]="columns" [toolbar]="" [labelSettings]="labelSettings" [allowSelection]='true' [allowResizing]='true'
@@ -208,6 +210,7 @@
     </div>
   </ng-template>
 </ejs-gantt>
+</div>
 <app-plan-time-bar #plantimeComponent *ngIf="!errorService.rsso && renderplanTime && renderGantt"
   [inputData]="inputForTimeline" [splitterSettings]="splitterSettings" [parentResources]="allResources"
   [filters]="filters"></app-plan-time-bar>
diff --git a/frontend/src/app/ntt-gantt/ntt-gantt.component.ts b/frontend/src/app/ntt-gantt/ntt-gantt.component.ts
index 5c9c244..4ffb408 100644
--- a/frontend/src/app/ntt-gantt/ntt-gantt.component.ts
+++ b/frontend/src/app/ntt-gantt/ntt-gantt.component.ts
@@ -21,6 +21,7 @@ import { DeletePresetDialogComponent } from '../delete-preset-dialog/delete-pres
 import { SavePresetUnderDialogComponent } from '../save-preset-under-dialog/save-preset-under-dialog.component';
 import { Location } from '@angular/common';
 import { environment } from 'src/environments/environment';
+import { GanttModule, ResizeService } from '@syncfusion/ej2-angular-gantt';
 
 
 export const MY_DATE_FORMATS = {
@@ -52,7 +53,7 @@ interface presetGroup {
   selector: 'ntt-gantt',
   templateUrl: './ntt-gantt.component.html',
   styleUrls: ['./ntt-gantt.component.css'],
-  providers: [
+  providers: [ResizeService,
     { provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS }
   ]
 })
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index cb0d05a..7dddc7e 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -32,3 +32,7 @@
   color: white !important;
   border: none;
 }
+
+html, body {
+  overflow: hidden !important;
+}