diff --git a/Changelog.md b/Changelog.md
index c6ddb0a0f..9d30c4ec4 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -31,6 +31,7 @@
 - 修复订阅中唯一的代理组名为 `GLOBAL` 或没有代理组时，规则模式下代理页面显示「未获取到代理信息」
 - 修复窗口较窄时，首页「当前节点」卡片中过长的节点名把延迟标签挤出卡片
 - 修复断开链式代理时清空已选节点，导致再次连接需要重新选择的问题
+- 修复「连接」页表格排序时表头换行、标题位置跳动的问题
 
 **🍎 macOS**
 
diff --git a/src/components/connection/connection-table.tsx b/src/components/connection/connection-table.tsx
index 37481c47e..bb8d90dc6 100644
--- a/src/components/connection/connection-table.tsx
+++ b/src/components/connection/connection-table.tsx
@@ -389,7 +389,7 @@ export const ConnectionTable = (props: Props) => {
       {
         field: 'download',
         headerName: t('shared.labels.downloaded'),
-        width: 76,
+        width: 96,
         minWidth: 60,
         align: 'right',
         cell: (_, snapshot) => snapshot.downloadText,
@@ -397,7 +397,7 @@ export const ConnectionTable = (props: Props) => {
       {
         field: 'upload',
         headerName: t('shared.labels.uploaded'),
-        width: 76,
+        width: 96,
         minWidth: 60,
         align: 'right',
         cell: (_, snapshot) => snapshot.uploadText,
@@ -405,7 +405,7 @@ export const ConnectionTable = (props: Props) => {
       {
         field: 'dlSpeed',
         headerName: t('connections.components.fields.dlSpeed'),
-        width: 76,
+        width: 96,
         minWidth: 60,
         align: 'right',
         cell: (_, snapshot) => snapshot.downloadSpeedText,
@@ -413,7 +413,7 @@ export const ConnectionTable = (props: Props) => {
       {
         field: 'ulSpeed',
         headerName: t('connections.components.fields.ulSpeed'),
-        width: 76,
+        width: 96,
         minWidth: 60,
         align: 'right',
         cell: (_, snapshot) => snapshot.uploadSpeedText,
@@ -798,6 +798,7 @@ export const ConnectionTable = (props: Props) => {
                       onClick={() => toggleSorting(column.field)}
                       style={{
                         flex: 1,
+                        minWidth: 0,
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent:
@@ -809,15 +810,33 @@ export const ConnectionTable = (props: Props) => {
                         color: 'inherit',
                         font: 'inherit',
                         textAlign: column.align === 'right' ? 'right' : 'left',
+                        whiteSpace: 'nowrap',
                         cursor: 'pointer',
                       }}
                     >
-                      {column.headerName}
-                      {sorting?.id === column.field
-                        ? sorting.desc
-                          ? '▼'
-                          : '▲'
-                        : null}
+                      <span
+                        style={{
+                          minWidth: 0,
+                          overflow: 'hidden',
+                          textOverflow: 'ellipsis',
+                        }}
+                      >
+                        {column.headerName}
+                      </span>
+                      {sorting?.id === column.field ? (
+                        <span style={{ flexShrink: 0 }}>
+                          {sorting.desc ? '▼' : '▲'}
+                        </span>
+                      ) : column.align === 'right' ? (
+                        // Reserve the indicator's space so right-aligned labels
+                        // don't shift when sorting is toggled.
+                        <span
+                          aria-hidden
+                          style={{ flexShrink: 0, visibility: 'hidden' }}
+                        >
+                          ▲
+                        </span>
+                      ) : null}
                     </button>
                     <div
                       onMouseDown={(event) =>