diff --git a/packages/nimble-components/src/table/styles.ts b/packages/nimble-components/src/table/styles.ts
index 6245b910a3..1505b3e469 100644
--- a/packages/nimble-components/src/table/styles.ts
+++ b/packages/nimble-components/src/table/styles.ts
@@ -116,25 +116,18 @@ export const styles = css`
         height: ${controlSlimHeight};
         cursor: col-resize;
         position: absolute;
-    }
-
-    .column-divider:hover {
-        border-color: ${borderHoverColor};
-    }
-
-    .column-divider.visible {
-        display: block;
         z-index: ${ZIndexLevels.zIndex1};
     }
 
-    .column-divider.active {
+    .column-divider:hover,
+    .column-divider.divider-active {
         border-color: ${borderHoverColor};
     }
 
-    .header-container:hover .column-divider.left,
-    .header-container:hover .column-divider.right {
+    .column-divider.column-active,
+    .header-container:hover .column-divider,
+    .header-container:hover .column-divider {
         display: block;
-        z-index: ${ZIndexLevels.zIndex1};
     }
 
     .column-divider::before {
diff --git a/packages/nimble-components/src/table/template.ts b/packages/nimble-components/src/table/template.ts
index af097976d9..fd9ad33b96 100644
--- a/packages/nimble-components/src/table/template.ts
+++ b/packages/nimble-components/src/table/template.ts
@@ -87,8 +87,8 @@ export const template = html<Table>`
                                             class="
                                                 column-divider
                                                 left
-                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'visible' : ''}`}
-                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getLeftDividerIndex(c.index) ? 'active' : ''}`}
+                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'column-active' : ''}`}
+                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getLeftDividerIndex(c.index) ? 'divider-active' : ''}`}
                                             "
                                             @mousedown="${(_, c) => c.parent.onLeftDividerMouseDown(c.event as MouseEvent, c.index)}">
                                         </div>
@@ -107,8 +107,8 @@ export const template = html<Table>`
                                             class="
                                                 column-divider
                                                 right
-                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'visible' : ''}`}
-                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getRightDividerIndex(c.index) ? 'active' : ''}`}
+                                                ${(_, c) => `${c.parent.layoutManager.activeColumnIndex === c.index ? 'column-active' : ''}`}
+                                                ${(_, c) => `${c.parent.layoutManager.activeColumnDivider === c.parent.getRightDividerIndex(c.index) ? 'divider-active' : ''}`}
                                             "
                                              @mousedown="${(_, c) => c.parent.onRightDividerMouseDown(c.event as MouseEvent, c.index)}">
                                         </div>
diff --git a/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts b/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts
index 1a9d8a0660..c902b9a58f 100644
--- a/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts
+++ b/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts
@@ -750,39 +750,39 @@ describe('Table Interactive Column Sizing', () => {
     describe('active divider tests', () => {
         const dividerActiveTests = [
             {
-                name: 'click on first column right divider only results in one active and one visible divider',
+                name: 'click on first column right divider',
                 dividerClickIndex: 0,
                 leftDividerClick: false,
-                expectedVisibleIndexes: [0]
+                expectedColumnActiveDividerIndexes: [0]
             },
             {
-                name: 'click on second column left divider results in one active and two visible dividers',
+                name: 'click on second column left divider',
                 dividerClickIndex: 1,
-                expectedVisibleIndexes: [1, 2]
+                expectedColumnActiveDividerIndexes: [1, 2]
             },
             {
-                name: 'click on second column right divider results in one active and two visible dividers',
+                name: 'click on second column right divider',
                 dividerClickIndex: 2,
-                expectedVisibleIndexes: [1, 2]
+                expectedColumnActiveDividerIndexes: [1, 2]
             },
             {
-                name: 'click on third column left divider results in one active and two visible dividers',
+                name: 'click on third column left divider',
                 dividerClickIndex: 3,
-                expectedVisibleIndexes: [3, 4]
+                expectedColumnActiveDividerIndexes: [3, 4]
             },
             {
-                name: 'click on third column right divider results in one active and two visible dividers',
+                name: 'click on third column right divider',
                 dividerClickIndex: 4,
-                expectedVisibleIndexes: [3, 4]
+                expectedColumnActiveDividerIndexes: [3, 4]
             },
             {
-                name: 'click on last column left divider only results in one active and one visible divider',
+                name: 'click on last column left divider',
                 dividerClickIndex: 5,
-                expectedVisibleIndexes: [5]
+                expectedColumnActiveDividerIndexes: [5]
             }
         ] as const;
         parameterizeSpec(dividerActiveTests, (spec, name, value) => {
-            spec(name, async () => {
+            spec(`${name} updates expected dividers as "divider-active" and "column-active"`, async () => {
                 const dividers = Array.from(
                     element.shadowRoot!.querySelectorAll('.column-divider')
                 );
@@ -795,21 +795,21 @@ describe('Table Interactive Column Sizing', () => {
                 const mouseUpEvent = new MouseEvent('mouseup');
                 divider.dispatchEvent(mouseDownEvent);
                 await waitForUpdatesAsync();
-                const activeDividers = [];
-                const visibleDividers = [];
+                const dividerActiveDividers = [];
+                const columnActiveDividers = [];
                 for (let i = 0; i < dividers.length; i++) {
-                    if (dividers[i]!.classList.contains('active')) {
-                        activeDividers.push(i);
+                    if (dividers[i]!.classList.contains('divider-active')) {
+                        dividerActiveDividers.push(i);
                     }
-                    if (dividers[i]!.classList.contains('visible')) {
-                        visibleDividers.push(i);
+                    if (dividers[i]!.classList.contains('column-active')) {
+                        columnActiveDividers.push(i);
                     }
                 }
                 document.dispatchEvent(mouseUpEvent); // clean up registered event handlers
 
-                expect(activeDividers.length).toEqual(1);
-                expect(activeDividers[0]).toEqual(value.dividerClickIndex);
-                expect(visibleDividers).toEqual(value.expectedVisibleIndexes);
+                expect(dividerActiveDividers.length).toEqual(1);
+                expect(dividerActiveDividers[0]).toEqual(value.dividerClickIndex);
+                expect(columnActiveDividers).toEqual(value.expectedColumnActiveDividerIndexes);
             });
         });
 
@@ -838,12 +838,12 @@ describe('Table Interactive Column Sizing', () => {
             });
             divider.dispatchEvent(mouseDownEvent);
             await waitForUpdatesAsync();
-            expect(divider.classList.contains('active')).toBeTruthy();
+            expect(divider.classList.contains('divider-active')).toBeTruthy();
 
             const mouseUpEvent = new MouseEvent('mouseup');
             document.dispatchEvent(mouseUpEvent);
             await waitForUpdatesAsync();
-            expect(divider.classList.contains('active')).toBeFalsy();
+            expect(divider.classList.contains('divider-active')).toBeFalsy();
         });
     });