diff --git a/packages/devextreme-angular/src/ui/nested/field-chooser.ts b/packages/devextreme-angular/src/ui/nested/field-chooser.ts
index 904f877abb58..1a5243206b30 100644
--- a/packages/devextreme-angular/src/ui/nested/field-chooser.ts
+++ b/packages/devextreme-angular/src/ui/nested/field-chooser.ts
@@ -57,10 +57,10 @@ export class DxoFieldChooserComponent extends NestedOption implements OnDestroy,
     }
 
     @Input()
-    get height(): number {
+    get height(): number | string {
         return this._getOption('height');
     }
-    set height(value: number) {
+    set height(value: number | string) {
         this._setOption('height', value);
     }
 
@@ -97,10 +97,10 @@ export class DxoFieldChooserComponent extends NestedOption implements OnDestroy,
     }
 
     @Input()
-    get width(): number {
+    get width(): number | string {
         return this._getOption('width');
     }
-    set width(value: number) {
+    set width(value: number | string) {
         this._setOption('width', value);
     }
 
diff --git a/packages/devextreme-angular/src/ui/pivot-grid/index.ts b/packages/devextreme-angular/src/ui/pivot-grid/index.ts
index 3ae22922c3b9..efc7d1d563ec 100644
--- a/packages/devextreme-angular/src/ui/pivot-grid/index.ts
+++ b/packages/devextreme-angular/src/ui/pivot-grid/index.ts
@@ -218,10 +218,10 @@ export class DxPivotGridComponent extends DxComponent implements OnDestroy, OnCh
     
      */
     @Input()
-    get fieldChooser(): { allowSearch?: boolean, applyChangesMode?: ApplyChangesMode, enabled?: boolean, height?: number, layout?: FieldChooserLayout, searchTimeout?: number, texts?: { allFields?: string, columnFields?: string, dataFields?: string, filterFields?: string, rowFields?: string }, title?: string, width?: number } {
+    get fieldChooser(): { allowSearch?: boolean, applyChangesMode?: ApplyChangesMode, enabled?: boolean, height?: number | string, layout?: FieldChooserLayout, searchTimeout?: number, texts?: { allFields?: string, columnFields?: string, dataFields?: string, filterFields?: string, rowFields?: string }, title?: string, width?: number | string } {
         return this._getOption('fieldChooser');
     }
-    set fieldChooser(value: { allowSearch?: boolean, applyChangesMode?: ApplyChangesMode, enabled?: boolean, height?: number, layout?: FieldChooserLayout, searchTimeout?: number, texts?: { allFields?: string, columnFields?: string, dataFields?: string, filterFields?: string, rowFields?: string }, title?: string, width?: number }) {
+    set fieldChooser(value: { allowSearch?: boolean, applyChangesMode?: ApplyChangesMode, enabled?: boolean, height?: number | string, layout?: FieldChooserLayout, searchTimeout?: number, texts?: { allFields?: string, columnFields?: string, dataFields?: string, filterFields?: string, rowFields?: string }, title?: string, width?: number | string }) {
         this._setOption('fieldChooser', value);
     }
 
@@ -637,7 +637,7 @@ export class DxPivotGridComponent extends DxComponent implements OnDestroy, OnCh
      * This member supports the internal infrastructure and is not intended to be used directly from your code.
     
      */
-    @Output() fieldChooserChange: EventEmitter<{ allowSearch?: boolean, applyChangesMode?: ApplyChangesMode, enabled?: boolean, height?: number, layout?: FieldChooserLayout, searchTimeout?: number, texts?: { allFields?: string, columnFields?: string, dataFields?: string, filterFields?: string, rowFields?: string }, title?: string, width?: number }>;
+    @Output() fieldChooserChange: EventEmitter<{ allowSearch?: boolean, applyChangesMode?: ApplyChangesMode, enabled?: boolean, height?: number | string, layout?: FieldChooserLayout, searchTimeout?: number, texts?: { allFields?: string, columnFields?: string, dataFields?: string, filterFields?: string, rowFields?: string }, title?: string, width?: number | string }>;
 
     /**
     
diff --git a/packages/devextreme-angular/src/ui/pivot-grid/nested/field-chooser.ts b/packages/devextreme-angular/src/ui/pivot-grid/nested/field-chooser.ts
index 0ec7764824c5..94a4aab037ea 100644
--- a/packages/devextreme-angular/src/ui/pivot-grid/nested/field-chooser.ts
+++ b/packages/devextreme-angular/src/ui/pivot-grid/nested/field-chooser.ts
@@ -57,10 +57,10 @@ export class DxoPivotGridFieldChooserComponent extends NestedOption implements O
     }
 
     @Input()
-    get height(): number {
+    get height(): number | string {
         return this._getOption('height');
     }
-    set height(value: number) {
+    set height(value: number | string) {
         this._setOption('height', value);
     }
 
@@ -97,10 +97,10 @@ export class DxoPivotGridFieldChooserComponent extends NestedOption implements O
     }
 
     @Input()
-    get width(): number {
+    get width(): number | string {
         return this._getOption('width');
     }
-    set width(value: number) {
+    set width(value: number | string) {
         this._setOption('width', value);
     }
 
diff --git a/packages/devextreme-react/src/pivot-grid.ts b/packages/devextreme-react/src/pivot-grid.ts
index b66e15851b7c..e7c6fa0eae86 100644
--- a/packages/devextreme-react/src/pivot-grid.ts
+++ b/packages/devextreme-react/src/pivot-grid.ts
@@ -97,7 +97,7 @@ type IFieldChooserProps = React.PropsWithChildren<{
   allowSearch?: boolean;
   applyChangesMode?: ApplyChangesMode;
   enabled?: boolean;
-  height?: number;
+  height?: number | string;
   layout?: FieldChooserLayout;
   searchTimeout?: number;
   texts?: Record<string, any> | {
@@ -108,7 +108,7 @@ type IFieldChooserProps = React.PropsWithChildren<{
     rowFields?: string;
   };
   title?: string;
-  width?: number;
+  width?: number | string;
 }>
 const _componentFieldChooser = (props: IFieldChooserProps) => {
   return React.createElement(NestedOption<IFieldChooserProps>, {
diff --git a/packages/devextreme-vue/src/pivot-grid.ts b/packages/devextreme-vue/src/pivot-grid.ts
index 141a531801b2..75169fb9ee02 100644
--- a/packages/devextreme-vue/src/pivot-grid.ts
+++ b/packages/devextreme-vue/src/pivot-grid.ts
@@ -228,12 +228,12 @@ const DxFieldChooserConfig = {
     allowSearch: Boolean,
     applyChangesMode: String as PropType<ApplyChangesMode>,
     enabled: Boolean,
-    height: Number,
+    height: [Number, String],
     layout: Number as PropType<FieldChooserLayout>,
     searchTimeout: Number,
     texts: Object as PropType<Record<string, any>>,
     title: String,
-    width: Number
+    width: [Number, String]
   }
 };
 
diff --git a/packages/devextreme/js/ui/pivot_grid.d.ts b/packages/devextreme/js/ui/pivot_grid.d.ts
index 0f4530d96ae1..1136e1aa97f0 100644
--- a/packages/devextreme/js/ui/pivot_grid.d.ts
+++ b/packages/devextreme/js/ui/pivot_grid.d.ts
@@ -281,7 +281,7 @@ export interface dxPivotGridOptions extends WidgetOptions<dxPivotGrid> {
        * @docid
        * @default 600
        */
-      height?: number;
+      height?: number | string;
       /**
        * @docid
        * @default 0
@@ -331,7 +331,7 @@ export interface dxPivotGridOptions extends WidgetOptions<dxPivotGrid> {
        * @docid
        * @default 600
        */
-      width?: number;
+      width?: number | string;
     };
     /**
      * @docid
diff --git a/packages/devextreme/ts/dx.all.d.ts b/packages/devextreme/ts/dx.all.d.ts
index dad9f7f75f14..8b1e40dc981f 100644
--- a/packages/devextreme/ts/dx.all.d.ts
+++ b/packages/devextreme/ts/dx.all.d.ts
@@ -24999,7 +24999,7 @@ declare module DevExpress.ui {
       /**
        * [descr:dxPivotGridOptions.fieldChooser.height]
        */
-      height?: number;
+      height?: number | string;
       /**
        * [descr:dxPivotGridOptions.fieldChooser.layout]
        */
@@ -25040,7 +25040,7 @@ declare module DevExpress.ui {
       /**
        * [descr:dxPivotGridOptions.fieldChooser.width]
        */
-      width?: number;
+      width?: number | string;
     };
     /**
      * [descr:dxPivotGridOptions.fieldPanel]