diff --git a/src/material/form-field/form-field.scss b/src/material/form-field/form-field.scss
index 0214f570416c..678874f69c45 100644
--- a/src/material/form-field/form-field.scss
+++ b/src/material/form-field/form-field.scss
@@ -84,6 +84,10 @@ $_icon-prefix-infix-padding: 4px;
   min-width: 0;
   // To avoid problems with text-align.
   text-align: left;
+  // Avoids stacking issues due to the absolutely-positioned
+  // descendants of the form field (see #28708)
+  position: relative;
+  z-index: 0;
 
   [dir='rtl'] & {
     text-align: right;
@@ -139,7 +143,7 @@ $_icon-prefix-infix-padding: 4px;
   // MDC applies `pointer-events: none` to the `.mdc-text-field--disabled`. This breaks clicking on
   // prefix and suffix buttons, so we override `pointer-events` to always allow clicking.
   pointer-events: auto;
-  // Needs a z-index to ensure it's on top of other content clickable. See #27043.
+  // Needs a z-index to ensure it's on top of other clickable content. See #27043.
   position: relative;
   z-index: 1;