diff --git a/src/components/timeline/Track.css b/src/components/timeline/Track.css
index a5ad187a6d..d1c2338525 100644
--- a/src/components/timeline/Track.css
+++ b/src/components/timeline/Track.css
@@ -12,7 +12,9 @@
 }
 
 .timelineTrackLocal {
-  margin-left: 15px;
+  --local-track-margin: 15px;
+
+  margin-left: var(--local-track-margin);
 }
 
 .timelineTrackRow {
@@ -23,26 +25,26 @@
 
   display: flex;
   flex-flow: row nowrap;
-
-  /* This padding is added to the button's padding as the perceived padding. For
-   * a global row, it will be replaced with a margin when it's selected. */
-  padding-left: var(--selected-left-border-width);
-  border-top: 1px solid var(--grey-30);
   background-color: #fff;
 }
 
 .timelineTrackRow.selected {
-  /* We replace the padding by some margin. Indeed the box-shadow used to draw
-   * the blue selected left border is drawn outside of the border box, so the
-   * 3px margin makes this space available. */
+  position: relative;
   padding-left: 0;
-  margin-left: var(--selected-left-border-width);
   background-color: #edf6ff;
+}
 
-  /* We use a box-shadow on the track row instead of using border, so
-   * that when we select adjacent tracks, we see just one line, without any
-   * border on top of it. */
-  box-shadow: calc(-1 * var(--selected-left-border-width)) 0 var(--blue-60);
+/* Showing a blue border on the left side of the track row to indicate that
+ * it's selected */
+.timelineTrackRow.selected::before {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: var(--selected-left-border-width);
+  background: var(--blue-60);
+  content: '';
+  pointer-events: none;
 }
 
 /* In the active tab view, we don't want any margin or padding, because
@@ -64,19 +66,25 @@
   border-left-color: transparent;
 }
 
+.timelineTrackLocalRow.selected::before {
+  /* We have a left border in local tracks of 1px, moving it left to conceal it. */
+  left: -1px;
+}
+
 .timelineTrackHidden {
   height: 0;
   pointer-events: none;
 }
 
 .timelineTrackLabel {
-  display: flex;
+  --timeline-track-label-width: 150px;
 
-  /* We want the width to look like it's 150px, but need to substract the 3px padding/margin */
-  width: calc(150px - var(--selected-left-border-width));
+  display: flex;
+  width: var(--timeline-track-label-width);
   box-sizing: border-box;
   flex-flow: row nowrap;
   align-items: center;
+  border-top: 1px solid var(--grey-30);
   border-right: 1px solid var(--grey-30);
   cursor: default;
 }
@@ -87,10 +95,7 @@
   /* The 8px are used by the box-shadow when the button receives focus */
   width: calc(100% - 8px);
   height: calc(100% - 8px);
-
-  /* We want the left padding to look like 10px, but need to remove 3px to
-   * account for the padding/margin on the row. */
-  padding: 0 0 0 calc(10px - var(--selected-left-border-width));
+  padding: 0 0 0 10px;
   border: none;
   background: none;
   font: inherit;
@@ -137,6 +142,7 @@
   display: flex;
   flex: 1;
   flex-flow: column nowrap;
+  border-top: 1px solid var(--grey-30);
 }
 
 .timelineTrackLocalTracks {
@@ -165,8 +171,11 @@
 }
 
 .timelineTrackLocalLabel {
-  /* We want the width to look like it's 150px, but need to substract the 3px padding/margin and the 1px border */
-  width: calc(135px - var(--selected-left-border-width) - 1px);
+  /* Calculate the width of the local track label by subtracting the margin and
+   * the 1px border from the total track label width. */
+  width: calc(
+    var(--timeline-track-label-width) - var(--local-track-margin) - 1px
+  );
 }
 
 @media (forced-colors: active) {