diff --git a/src/material/autocomplete/autocomplete.scss b/src/material/autocomplete/autocomplete.scss
index 064b07fc8412..ea952abd0569 100644
--- a/src/material/autocomplete/autocomplete.scss
+++ b/src/material/autocomplete/autocomplete.scss
@@ -14,8 +14,9 @@ div.mat-mdc-autocomplete-panel {
   padding: 8px 0;
   box-sizing: border-box;
 
-  // Workaround in case other MDC menu surface styles bleed in.
-  position: static;
+  // Necessary so the `offsetParent` of the nested `mat-option` is the
+  // panel which is required for scroll calculations (see #30974).
+  position: relative;
 
   @include token-utils.use-tokens(
     tokens-mat-autocomplete.$prefix, tokens-mat-autocomplete.get-token-slots()) {
diff --git a/src/material/select/select.scss b/src/material/select/select.scss
index 7636c4b2e152..cdd98fbf7ba5 100644
--- a/src/material/select/select.scss
+++ b/src/material/select/select.scss
@@ -165,8 +165,9 @@ div.mat-mdc-select-panel {
   border-radius: 4px;
   box-sizing: border-box;
 
-  // Workaround in case other MDC menu surface styles bleed in.
-  position: static;
+  // Necessary so the `offsetParent` of the nested `mat-option` is the
+  // panel which is required for scroll calculations (see #30974).
+  position: relative;
 
   @include token-utils.use-tokens(
     tokens-mat-select.$prefix, tokens-mat-select.get-token-slots()) {
@@ -188,10 +189,6 @@ div.mat-mdc-select-panel {
     border-bottom-right-radius: 0;
     transform-origin: bottom center;
   }
-
-  .mat-mdc-option {
-    --mdc-list-list-item-container-color: var(--mat-select-panel-background-color);
-  }
 }
 
 .mat-select-panel-animations-enabled {
diff --git a/src/material/timepicker/timepicker.scss b/src/material/timepicker/timepicker.scss
index fd98d9c01294..0239b1e7e408 100644
--- a/src/material/timepicker/timepicker.scss
+++ b/src/material/timepicker/timepicker.scss
@@ -36,6 +36,10 @@ mat-timepicker {
   padding: 8px 0;
   box-sizing: border-box;
 
+  // Necessary so the `offsetParent` of the nested `mat-option` is the
+  // panel which is required for scroll calculations (see #30974).
+  position: relative;
+
   @include token-utils.use-tokens(
     tokens-mat-timepicker.$prefix, tokens-mat-timepicker.get-token-slots()) {
     @include token-utils.create-token-slot(border-bottom-left-radius, container-shape);