diff --git a/assets/index.less b/assets/index.less
index bfa245b03..ef38409d3 100644
--- a/assets/index.less
+++ b/assets/index.less
@@ -44,7 +44,6 @@
 
     padding: @cell-padding;
     white-space: normal;
-    word-break: break-word;
     border: @border;
     border-top: 0;
     border-left: 0;
diff --git a/docs/examples/scrollY.tsx b/docs/examples/scrollY.tsx
index 52622db5f..d9acf52eb 100644
--- a/docs/examples/scrollY.tsx
+++ b/docs/examples/scrollY.tsx
@@ -76,6 +76,9 @@ const Test = () => {
         rowKey={record => record.key}
         onRow={(record, index) => ({ style: { backgroundColor: 'red' } })}
       />
+      <h3>Column align issue</h3>
+      <p>https://github.com/ant-design/ant-design/issues/54889</p>
+      <Table columns={columns} data={data} sticky scroll={{ y: 300, x: 2000 }} />
     </div>
   );
 };
diff --git a/docs/examples/stickyHeader.tsx b/docs/examples/stickyHeader.tsx
index 52f285675..a004c1dba 100644
--- a/docs/examples/stickyHeader.tsx
+++ b/docs/examples/stickyHeader.tsx
@@ -137,6 +137,34 @@ const data = [
   { a: '1333', c: 'eee', d: 2, key: '20' },
 ];
 
+const columns3: ColumnType<RecordType>[] = [
+  { title: '', dataIndex: 'name', key: '0' },
+  { title: 'First column', dataIndex: 'name', key: '1' },
+  { title: 'Second column', dataIndex: 'address', key: '2' },
+  { title: 'Third column', dataIndex: 'age', key: '3' },
+  { title: 'Another column', dataIndex: 'address', key: '4' },
+  { title: 'Extra column', dataIndex: 'name', key: '5' },
+  { title: 'And yet another column', dataIndex: 'address', key: '6' },
+  {
+    title: 'Column 7 with extraaaaaaaaa long word',
+    dataIndex: 'age',
+    key: '7',
+  },
+  { title: 'Column 8', dataIndex: 'address', key: '8' },
+  { title: 'Column 9', dataIndex: 'name', key: '9' },
+  { title: 'Column 10', dataIndex: 'address', key: '10' },
+  { title: 'Column 11', dataIndex: 'address', key: '11' },
+  { title: 'Column 12', dataIndex: 'age', key: '12' },
+  { title: 'Column 13', dataIndex: 'address', key: '13' },
+  { title: 'Column 14', dataIndex: 'name', key: '14' },
+  { title: 'Column 15', dataIndex: 'address', key: '15' },
+  { title: 'Column 16', dataIndex: 'address', key: '16' },
+  { title: 'Column 17', dataIndex: 'name', key: '17' },
+  { title: 'Column 18', dataIndex: 'address', key: '18' },
+  { title: 'Column 19', dataIndex: 'address', key: '19' },
+  { title: 'Column 20', dataIndex: 'age', key: '20' },
+];
+
 const Demo = () => {
   const container = useRef();
   return (
@@ -274,7 +302,7 @@ const Demo = () => {
       <br />
       <Table
         columns={fixedColumns}
-        data={[{}]}
+        data={[{ key: '1' }]}
         scroll={{
           x: 'max-content',
         }}
@@ -283,7 +311,7 @@ const Demo = () => {
       <br />
       <Table
         columns={columnsWithWidth}
-        data={[{}]}
+        data={[{ key: '1' }]}
         scroll={{
           x: 1200,
         }}
@@ -301,7 +329,7 @@ const Demo = () => {
       <br />
       <Table
         columns={fixedColumns.map(column => ({ ...column, width: undefined }))}
-        data={[{}]}
+        data={[{ key: '1' }]}
         scroll={{
           x: 'max-content',
         }}
@@ -310,12 +338,26 @@ const Demo = () => {
       <br />
       <Table
         columns={columnsGrouped}
-        data={[{}, {}]}
+        data={[{ key: '1' }, { key: '2' }]}
         scroll={{
           x: 'max-content',
         }}
         sticky
       />
+      <br />
+      <h3>scroll.x is true</h3>
+      <p>https://github.com/ant-design/ant-design/issues/54894</p>
+      <Table
+        columns={columns3}
+        data={
+          [
+            { key: '1', name: 'Test', age: 1, address: '2' },
+            { key: '2', name: '0', age: 1, address: '2' },
+          ] as any
+        }
+        sticky
+        scroll={{ x: true }}
+      />
     </div>
   );
 };
diff --git a/src/ColGroup.tsx b/src/ColGroup.tsx
index 6c49f304f..95b9a839d 100644
--- a/src/ColGroup.tsx
+++ b/src/ColGroup.tsx
@@ -40,7 +40,7 @@ function ColGroup<RecordType>({ colWidths, columns, columCount }: ColGroupProps<
     }
   }
 
-  return <colgroup>{cols}</colgroup>;
+  return cols.length > 0 ? <colgroup>{cols}</colgroup> : null;
 }
 
 export default ColGroup;
diff --git a/src/FixedHolder/index.tsx b/src/FixedHolder/index.tsx
index 09e4598b1..c7513894b 100644
--- a/src/FixedHolder/index.tsx
+++ b/src/FixedHolder/index.tsx
@@ -34,7 +34,7 @@ export interface FixedHeaderProps<RecordType> extends HeaderProps<RecordType> {
   stickyTopOffset?: number;
   stickyBottomOffset?: number;
   stickyClassName?: string;
-  scrollTableStyle?: React.CSSProperties;
+  scrollX?: number | string | true;
   tableLayout?: TableLayout;
   onScroll: (info: { currentTarget: HTMLDivElement; scrollLeft?: number }) => void;
   children: (info: HeaderProps<RecordType>) => React.ReactNode;
@@ -60,7 +60,7 @@ const FixedHolder = React.forwardRef<HTMLDivElement, FixedHeaderProps<any>>((pro
     stickyTopOffset,
     stickyBottomOffset,
     stickyClassName,
-    scrollTableStyle,
+    scrollX,
     tableLayout = 'fixed',
     onScroll,
     children,
@@ -179,7 +179,9 @@ const FixedHolder = React.forwardRef<HTMLDivElement, FixedHeaderProps<any>>((pro
         style={{
           tableLayout,
           visibility: noData || mergedColumnWidth ? null : 'hidden',
-          ...scrollTableStyle,
+          minWidth: '100%',
+          // https://github.com/ant-design/ant-design/issues/54894
+          width: scrollX,
         }}
       >
         {colGroupNode}
diff --git a/src/Table.tsx b/src/Table.tsx
index 0a3c9a1ac..7a2ca550a 100644
--- a/src/Table.tsx
+++ b/src/Table.tsx
@@ -684,7 +684,7 @@ function Table<RecordType extends DefaultRecordType>(
       ...columnContext,
       direction,
       stickyClassName,
-      scrollTableStyle,
+      scrollX: mergedScrollX,
       tableLayout: mergedTableLayout,
       onScroll: onInternalScroll,
     };
diff --git a/tests/__snapshots__/ExpandRow.spec.jsx.snap b/tests/__snapshots__/ExpandRow.spec.jsx.snap
index 5c0ee296d..494f6d92d 100644
--- a/tests/__snapshots__/ExpandRow.spec.jsx.snap
+++ b/tests/__snapshots__/ExpandRow.spec.jsx.snap
@@ -14,7 +14,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -519,7 +518,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -861,7 +859,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -996,7 +993,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
diff --git a/tests/__snapshots__/FixedColumn.spec.tsx.snap b/tests/__snapshots__/FixedColumn.spec.tsx.snap
index 621fd9255..56f99b870 100644
--- a/tests/__snapshots__/FixedColumn.spec.tsx.snap
+++ b/tests/__snapshots__/FixedColumn.spec.tsx.snap
@@ -1941,7 +1941,7 @@ LoadedCheerio {
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 1200px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 1200px;"
         >
           <colgroup>
             <col
@@ -2814,7 +2814,7 @@ LoadedCheerio {
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 1200px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 1200px;"
         >
           <colgroup>
             <col
@@ -3136,7 +3136,7 @@ exports[`Table.FixedColumn > shadow should be shown when there are columns where
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 1500px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 1500px;"
         >
           <colgroup>
             <col
@@ -3200,7 +3200,6 @@ exports[`Table.FixedColumn > shadow should be shown when there are columns where
         <table
           style="width: 1500px; min-width: 100%; table-layout: fixed;"
         >
-          <colgroup />
           <tbody
             class="rc-table-tbody"
           >
@@ -5567,7 +5566,7 @@ exports[`Table.FixedColumn > shadow should display correctly 1`] = `
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 1500px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 1500px;"
         >
           <colgroup>
             <col
@@ -11653,7 +11652,7 @@ exports[`Table.FixedColumn > shadow should display correctly 2`] = `
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 1500px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 1500px;"
         >
           <colgroup>
             <col
diff --git a/tests/__snapshots__/Table.spec.jsx.snap b/tests/__snapshots__/Table.spec.jsx.snap
index f3edd6e4d..ecbda0bad 100644
--- a/tests/__snapshots__/Table.spec.jsx.snap
+++ b/tests/__snapshots__/Table.spec.jsx.snap
@@ -17,7 +17,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -120,7 +119,6 @@ LoadedCheerio {
           name="my-table"
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
             name="my-header-wrapper"
@@ -214,9 +212,8 @@ LoadedCheerio {
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 100px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 100px;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
             name="my-header-wrapper"
@@ -264,7 +261,6 @@ LoadedCheerio {
           name="my-table"
           style="width: 100px; min-width: 100%; table-layout: fixed;"
         >
-          <colgroup />
           <tbody
             class="rc-table-tbody"
             name="my-body-wrapper"
@@ -377,7 +373,7 @@ LoadedCheerio {
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed; width: 100px; min-width: 100%;"
+          style="table-layout: fixed; min-width: 100%; width: 100px;"
         >
           <colgroup>
             <col
@@ -457,7 +453,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -567,7 +562,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -660,7 +654,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="test-prefix-thead"
           >
@@ -746,7 +739,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="test-prefix-thead"
           >
@@ -832,7 +824,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -930,7 +921,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -1016,7 +1006,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -1095,7 +1084,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >
@@ -1192,7 +1180,7 @@ LoadedCheerio {
         style="overflow: hidden;"
       >
         <table
-          style="table-layout: fixed;"
+          style="table-layout: fixed; min-width: 100%;"
         >
           <colgroup>
             <col
@@ -1266,7 +1254,6 @@ LoadedCheerio {
         <table
           style="table-layout: auto;"
         >
-          <colgroup />
           <thead
             class="rc-table-thead"
           >