diff --git a/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts b/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts
index 0f35d0b604be66e5fd76ec6468b9943a9c44a093..ba71e8d083bc51043c36194e3cdfa9818ff7542f 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts
+++ b/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-sizing-properties.component.ts
@@ -9,7 +9,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
   selector: 'app-element-sizing-properties',
   template: `
     <div fxLayout="column">
-      <ng-container *ngIf="!combinedProperties.dynamicPositioning; else elseBlock">
+      <ng-container *ngIf="!combinedProperties.positionProps?.dynamicPositioning; else elseBlock">
         <mat-form-field appearance="fill">
           <mat-label>{{'propertiesPanel.width' | translate }}</mat-label>
           <input matInput type="number" #width="ngModel" min="0"
@@ -27,7 +27,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
                                                      isInputValid: height.valid && $event !== null})">
         </mat-form-field>
 
-        <mat-form-field appearance="fill">
+        <mat-form-field *ngIf="combinedProperties.positionProps" appearance="fill">
           <mat-label>{{'propertiesPanel.xPosition' | translate }}</mat-label>
           <input matInput type="number" #xPosition="ngModel" min="0"
                  [ngModel]="combinedProperties.positionProps?.xPosition"
@@ -35,7 +35,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
                     { property: 'xPosition', value: $event, isInputValid: xPosition.valid && $event !== null })">
         </mat-form-field>
 
-        <mat-form-field appearance="fill">
+        <mat-form-field *ngIf="combinedProperties.positionProps" appearance="fill">
           <mat-label>{{'propertiesPanel.yPosition' | translate }}</mat-label>
           <input matInput type="number" #yPosition="ngModel" min="0"
                  [ngModel]="combinedProperties.positionProps?.yPosition"
@@ -44,7 +44,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
         </mat-form-field>
       </ng-container>
       <ng-template #elseBlock>
-        <mat-form-field appearance="fill">
+        <mat-form-field appearance="fill" *ngIf="combinedProperties.positionProps !== undefined">
           <mat-label>{{'propertiesPanel.minWidth' | translate }}</mat-label>
           <input matInput type="number" #width="ngModel" min="0"
                  [ngModel]="combinedProperties.width"
@@ -53,7 +53,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
                                                      isInputValid: width.valid && $event !== null })">
         </mat-form-field>
 
-        <mat-checkbox *ngIf="combinedProperties.positionProps?.useMinHeight !== undefined"
+        <mat-checkbox *ngIf="combinedProperties.positionProps !== undefined"
                       [checked]="$any(combinedProperties.positionProps?.useMinHeight)"
                       (change)="updateModel.emit({ property: 'useMinHeight', value: $event.checked })">
           {{'propertiesPanel.useMinHeight' | translate }}
@@ -135,7 +135,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
         </div>
       </ng-template>
 
-      <mat-form-field appearance="fill">
+      <mat-form-field *ngIf="combinedProperties.positionProps" appearance="fill">
         <mat-label>{{'propertiesPanel.zIndex' | translate }}</mat-label>
         <input matInput type="number" #zIndex="ngModel" min="0"
                [ngModel]="combinedProperties.positionProps?.zIndex"
diff --git a/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-style-properties.component.ts b/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-style-properties.component.ts
index b8b01fbe009331d283577d8420fe524153d6ac31..740e5ac6e13e9993371b45336bf5d5b684321e30 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-style-properties.component.ts
+++ b/projects/editor/src/app/components/unit-view/page-view/properties-panel/element-style-properties.component.ts
@@ -26,39 +26,39 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
                (input)="updateModel.emit({ property: 'itemBackgroundColor', value: $any($event.target).value })">
       </mat-form-field>
 
-      <mat-form-field *ngIf="combinedProperties.surfaceProps?.backgroundColor !== undefined"
+      <mat-form-field *ngIf="combinedProperties.surfaceProps"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.backgroundColor' | translate }}</mat-label>
         <input matInput type="color" [value]="combinedProperties.surfaceProps?.backgroundColor"
                (input)="updateModel.emit({ property: 'backgroundColor', value: $any($event.target).value })">
       </mat-form-field>
-      <mat-form-field *ngIf="combinedProperties.surfaceProps?.backgroundColor !== undefined"
+      <mat-form-field *ngIf="combinedProperties.surfaceProps"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.backgroundColor' | translate }}</mat-label>
         <input matInput type="text" [value]="combinedProperties.surfaceProps?.backgroundColor"
                (input)="updateModel.emit({ property: 'backgroundColor', value: $any($event.target).value })">
       </mat-form-field>
 
-      <mat-form-field *ngIf="combinedProperties.fontProps?.fontColor !== undefined"
+      <mat-form-field *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.fontColor !== undefined"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.fontColor' | translate }}</mat-label>
         <input matInput type="color" [value]="combinedProperties.fontProps?.fontColor"
                (input)="updateModel.emit({ property: 'fontColor', value: $any($event.target).value })">
       </mat-form-field>
-      <mat-form-field *ngIf="combinedProperties.fontProps?.fontColor !== undefined"
+      <mat-form-field *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.fontColor !== undefined"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.fontColor' | translate }}</mat-label>
         <input matInput type="text" [value]="combinedProperties.fontProps?.fontColor"
                (input)="updateModel.emit({ property: 'fontColor', value: $any($event.target).value })">
       </mat-form-field>
 
-      <mat-form-field *ngIf="combinedProperties.fontProps?.font !== undefined"
+      <mat-form-field *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.font !== undefined"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.font' | translate }}</mat-label>
         <input matInput type="text" [value]="combinedProperties.fontProps?.font"
                (input)="updateModel.emit({ property: 'font', value: $any($event.target).value })">
       </mat-form-field>
-      <mat-form-field *ngIf="combinedProperties.fontProps?.fontSize !== undefined"
+      <mat-form-field *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.fontSize !== undefined"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.fontSize' | translate }}</mat-label>
         <input matInput type="number" #fontSize="ngModel" min="0"
@@ -67,7 +67,7 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
                                                    value: $event,
                                                    isInputValid: fontSize.valid && $event !== null})">
       </mat-form-field>
-      <mat-form-field *ngIf="combinedProperties.fontProps?.lineHeight !== undefined"
+      <mat-form-field *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.lineHeight !== undefined"
                       appearance="fill" class="mdInput textsingleline">
         <mat-label>{{'propertiesPanel.lineHeight' | translate }}</mat-label>
         <input matInput type="number" #lineHeight="ngModel" min="0"
@@ -77,17 +77,17 @@ import { UIElement } from '../../../../../../../common/models/uI-element';
                                                    isInputValid: lineHeight.valid && $event !== null })">
       </mat-form-field>
 
-      <mat-checkbox *ngIf="combinedProperties.fontProps?.bold !== undefined"
+      <mat-checkbox *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.bold !== undefined"
                     [checked]="$any(combinedProperties.fontProps?.bold)"
                     (change)="updateModel.emit({ property: 'bold', value: $event.checked })">
         {{'propertiesPanel.bold' | translate }}
       </mat-checkbox>
-      <mat-checkbox *ngIf="combinedProperties.fontProps?.italic !== undefined"
+      <mat-checkbox *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.italic !== undefined"
                     [checked]="$any(combinedProperties.fontProps?.italic)"
                     (change)="updateModel.emit({ property: 'italic', value: $event.checked })">
         {{'propertiesPanel.italic' | translate }}
       </mat-checkbox>
-      <mat-checkbox *ngIf="combinedProperties.fontProps?.underline !== undefined"
+      <mat-checkbox *ngIf="combinedProperties.fontProps && combinedProperties.fontProps.underline !== undefined"
                     [checked]="$any(combinedProperties.fontProps?.underline)"
                     (change)="updateModel.emit({ property: 'underline', value: $event.checked })">
         {{'propertiesPanel.underline' | translate }}