diff --git a/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap b/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap
index e3b38773304..8865aa79ae0 100644
--- a/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap
+++ b/packages/main/src/components/AnalyticalTable/__snapshots__/AnalyticalTable.test.tsx.snap
@@ -311,7 +311,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -323,7 +323,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -335,7 +335,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -347,7 +347,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -366,7 +366,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -378,7 +378,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -390,7 +390,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -402,7 +402,7 @@ exports[`AnalyticalTable Alternate Row Color 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -785,7 +785,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -797,7 +797,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -809,7 +809,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -821,7 +821,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -840,7 +840,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -852,7 +852,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -864,7 +864,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -876,7 +876,7 @@ exports[`AnalyticalTable Loading - Loader 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -1871,7 +1871,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 style="cursor: pointer; padding-left: 0px;"
@@ -1893,7 +1893,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 style="padding-left: 0px;"
@@ -1908,7 +1908,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 style="padding-left: 0px;"
@@ -1923,7 +1923,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 style="padding-left: 0px;"
@@ -1945,7 +1945,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span />
               <span
@@ -1958,7 +1958,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 style="padding-left: 0px;"
@@ -1973,7 +1973,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 style="padding-left: 0px;"
@@ -1988,7 +1988,7 @@ exports[`AnalyticalTable Tree Table 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 style="padding-left: 0px;"
@@ -2374,7 +2374,7 @@ exports[`AnalyticalTable custom row height 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2386,7 +2386,7 @@ exports[`AnalyticalTable custom row height 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2398,7 +2398,7 @@ exports[`AnalyticalTable custom row height 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2410,7 +2410,7 @@ exports[`AnalyticalTable custom row height 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2429,7 +2429,7 @@ exports[`AnalyticalTable custom row height 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2441,7 +2441,7 @@ exports[`AnalyticalTable custom row height 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2453,7 +2453,7 @@ exports[`AnalyticalTable custom row height 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -2465,7 +2465,7 @@ exports[`AnalyticalTable custom row height 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3154,7 +3154,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3166,7 +3166,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3178,7 +3178,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3190,7 +3190,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3209,7 +3209,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3221,7 +3221,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3233,7 +3233,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3245,7 +3245,7 @@ exports[`AnalyticalTable test Asc desc 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3628,7 +3628,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3640,7 +3640,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3652,7 +3652,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3664,7 +3664,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3683,7 +3683,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
           >
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 0px; width: 60px;"
+              style="position: absolute; top: 0px; left: 0px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3695,7 +3695,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 60px; width: 60px;"
+              style="position: absolute; top: 0px; left: 60px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3707,7 +3707,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 120px; width: 60px;"
+              style="position: absolute; top: 0px; left: 120px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
@@ -3719,7 +3719,7 @@ exports[`AnalyticalTable test drag and drop of a draggable column 1`] = `
             </div>
             <div
               class="AnalyticalTable--tableCell-"
-              style="position: absolute; top: 0px; left: 180px; width: 60px;"
+              style="position: absolute; top: 0px; left: 180px; width: 60px; align-items: center;"
             >
               <span
                 class="Text--text- Text--noWrap-"
diff --git a/packages/main/src/components/AnalyticalTable/hooks/useTableCellStyling.ts b/packages/main/src/components/AnalyticalTable/hooks/useTableCellStyling.ts
index 72f3a91b844..64b980b830d 100644
--- a/packages/main/src/components/AnalyticalTable/hooks/useTableCellStyling.ts
+++ b/packages/main/src/components/AnalyticalTable/hooks/useTableCellStyling.ts
@@ -5,39 +5,40 @@ import { PluginHook } from 'react-table';
 
 export const useTableCellStyling: PluginHook<{}> = (hooks) => {
   hooks.getCellProps.push((cellProps, { cell: { column }, instance }) => {
-    const { classes, rowHeight } = instance.webComponentsReactProperties;
+    const { classes } = instance.webComponentsReactProperties;
     const style: CSSProperties = {};
 
-    if (rowHeight) {
-      style.height = `${rowHeight}px`;
-    }
-
     switch (column.hAlign) {
       case TextAlign.Begin:
+        style.justifyContent = 'flex-start';
         style.textAlign = 'start';
         break;
       case TextAlign.Center:
+        style.justifyContent = 'center';
         style.textAlign = 'center';
         break;
       case TextAlign.End:
+        style.justifyContent = 'flex-end';
         style.textAlign = 'end';
         break;
       case TextAlign.Left:
+        style.justifyContent = 'left';
         style.textAlign = 'left';
         break;
       case TextAlign.Right:
+        style.justifyContent = 'right';
         style.textAlign = 'right';
         break;
     }
     switch (column.vAlign) {
       case VerticalAlign.Bottom:
-        style.verticalAlign = 'bottom';
+        style.alignItems = 'flex-end';
         break;
       case VerticalAlign.Middle:
-        style.verticalAlign = 'middle';
+        style.alignItems = 'center';
         break;
       case VerticalAlign.Top:
-        style.verticalAlign = 'top';
+        style.alignItems = 'flex-start';
         break;
     }
 
@@ -51,7 +52,7 @@ export const useTableCellStyling: PluginHook<{}> = (hooks) => {
       className,
       style: {
         ...cellProps.style,
-        style
+        ...style
       }
     };
   });
diff --git a/packages/main/src/components/AnalyticalTable/index.tsx b/packages/main/src/components/AnalyticalTable/index.tsx
index efbc465fc6b..cd6c9c1f658 100644
--- a/packages/main/src/components/AnalyticalTable/index.tsx
+++ b/packages/main/src/components/AnalyticalTable/index.tsx
@@ -204,7 +204,6 @@ const AnalyticalTable: FC<TableProps> = forwardRef((props: TableProps, ref: Ref<
         selectionMode,
         classes,
         onRowSelected,
-        rowHeight,
         onRowExpandChange,
         isTreeTable
       },