diff --git a/dmp-frontend/src/app/form/dynamic-form.component.css b/dmp-frontend/src/app/form/dynamic-form.component.css
index ba926be1f..d4039005e 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.css
+++ b/dmp-frontend/src/app/form/dynamic-form.component.css
@@ -12,4 +12,8 @@
     margin-bottom: 1em;
     padding: 20px;
     width: 100%;
-}
\ No newline at end of file
+}
+
+.ui-steps .ui-steps-item {
+    min-width: 10%;
+}
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.ts b/dmp-frontend/src/app/form/dynamic-form.component.ts
index 3f152e5f8..f01f045a4 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.ts
+++ b/dmp-frontend/src/app/form/dynamic-form.component.ts
@@ -67,7 +67,7 @@ export class DynamicFormComponent implements OnInit {
   visibleSidebar: boolean = false;
 
   private progressbar: boolean = false;
-  private currentPage: number;
+  private currentPage: number = 0;
 
   private fragment: string;
   constructor(private serverService: ServerService, private router: Router, private pdfService: PDFService,
@@ -141,17 +141,17 @@ export class DynamicFormComponent implements OnInit {
   }
 
   shouldDisplaySection(section: Section): Boolean {
-    return section.page == this.currentPage;
+    return (section.page - 1) == this.currentPage;
   }
-  
+
   createPagination() {
     this.pages.forEach(item => {
-      this.stepperItems.push({
-        label: '',
-        command: (event: any) => {
-          this.currentPage = event.index;
-        }
-      })
+        this.stepperItems.push({
+          label: '',
+          command: (event: any) => {
+            this.currentPage = event.index;
+          }
+        })
     });
   }
   /* scrollToElemID(elemID) {