diff --git a/resources/index.js b/resources/index.js
index 7bdefd4..9be8cd3 100644
--- a/resources/index.js
+++ b/resources/index.js
@@ -253,21 +253,22 @@ var ProgressTracker = {
             autoClose: false
         } );
 
-        $( document.body ).append( popup.$element );
-
         const rowCheckboxes = document.querySelectorAll( this.options.selectors.checkbox );
 
         rowCheckboxes.forEach( function ( checkbox ) {
             // paranoia!
             checkbox.disabled = true;
 
-            checkbox.addEventListener( 'mouseenter', function () {
+            const container = checkbox.closest( '.cdx-checkbox' ) || checkbox.parentNode;
+
+            container.addEventListener( 'mouseenter', function () {
+                container.appendChild( popup.$element[ 0 ] );
                 popup.toggleAnchor( true );
                 popup.setFloatableContainer( $( checkbox ) );
                 popup.toggle( true );
             } );
 
-            checkbox.addEventListener( 'mouseleave', function () {
+            container.addEventListener( 'mouseleave', function () {
                 popup.toggle( false );
             } );
         } );
diff --git a/resources/index.less b/resources/index.less
index f4ab3d1..899f1fa 100644
--- a/resources/index.less
+++ b/resources/index.less
@@ -25,3 +25,14 @@ td.progress-tracker-checkbox-cell:has(input[type="checkbox"]:checked) {
 	width: max-content;
 	display: flex;
 }
+
+.progress-tracker-checkbox-cell .oo-ui-popupWidget {
+	// Increase from the default of 1 so that another checkbox doesn't take over the current popup when both
+	// are hovered.
+	z-index: 2;
+
+	// Remove the skin's default margins.
+	p {
+		margin: 0;
+	}
+}