diff --git a/projects/common/element-components/compound-elements/drop-list.component.ts b/projects/common/element-components/compound-elements/drop-list.component.ts
index ddce3b9b131e2aa6a9723de31f8a5fbcf3b1c872..a608e2d8cb4c37624144edd0fa4810e660b73e42 100644
--- a/projects/common/element-components/compound-elements/drop-list.component.ts
+++ b/projects/common/element-components/compound-elements/drop-list.component.ts
@@ -7,7 +7,18 @@ import { FormElementComponent } from '../../form-element-component.directive';
 @Component({
   selector: 'app-drop-list',
   template: `
-    <div class="list" cdkDropList
+    <!-- TODO width/height 90 to not produce overflow. find better solution. -->
+    <div class="list"
+         [style.width.%]="90"
+         [style.height.%]="90"
+         [style.color]="elementModel.fontColor"
+         [style.font-family]="elementModel.font"
+         [style.font-size.px]="elementModel.fontSize"
+         [style.font-weight]="elementModel.bold ? 'bold' : ''"
+         [style.font-style]="elementModel.italic ? 'italic' : ''"
+         [style.text-decoration]="elementModel.underline ? 'underline' : ''"
+         [style.backgroundColor]="elementModel.backgroundColor"
+         cdkDropList
          [id]="elementModel.id"
          [cdkDropListData]="this"
          [cdkDropListConnectedTo]="elementModel.connectedTo"