diff --git a/src/material/list/list-item.html b/src/material/list/list-item.html
index 1d49a0c95949..03e57de4ac13 100644
--- a/src/material/list/list-item.html
+++ b/src/material/list/list-item.html
@@ -1,13 +1,13 @@
-<div class="mat-list-item-content">
-  <div class="mat-list-item-ripple" mat-ripple
+<span class="mat-list-item-content">
+  <span class="mat-list-item-ripple" mat-ripple
        [matRippleTrigger]="_getHostElement()"
        [matRippleDisabled]="_isRippleDisabled()">
-  </div>
+  </span>
 
   <ng-content select="[mat-list-avatar], [mat-list-icon], [matListAvatar], [matListIcon]">
   </ng-content>
 
-  <div class="mat-list-text"><ng-content select="[mat-line], [matLine]"></ng-content></div>
+  <span class="mat-list-text"><ng-content select="[mat-line], [matLine]"></ng-content></span>
 
   <ng-content></ng-content>
-</div>
+</span>
diff --git a/src/material/list/list.scss b/src/material/list/list.scss
index 05a5e83733f8..759412410be9 100644
--- a/src/material/list/list.scss
+++ b/src/material/list/list.scss
@@ -66,6 +66,7 @@ $item-inset-divider-offset: 72px;
   }
 
   .mat-list-item-ripple {
+    display: block;
     @include layout-common.fill;
 
     // Disable pointer events for the ripple container because the container will overlay the