diff --git a/src/components/networked-video-player.css b/src/components/networked-video-player.css
index e6859395801b79bddc37c85c53a92e6a1780c8ec..93bbacfe8da21fccd3ae8031d31f48bd744738a4 100644
--- a/src/components/networked-video-player.css
+++ b/src/components/networked-video-player.css
@@ -1,12 +1,13 @@
 :local(.video) {
-  height: 100px;
+  /* 1x1px so that Safari on iOS allows us to autoplay the video */
+  width: 1px; height: 1px; /* toggle to show debug video elements */
   background: black;
-  margin: 5px;
 }
 
 :local(.container) {
     position: absolute;
     bottom: 0;
     display: flex;
-    visibility: hidden; /* toggle to show debug video elements */
+    /* 1x1px so that Safari on iOS allows us to autoplay the video */
+    width: 1px; height: 1px; /* toggle to show debug video elements */
 }
diff --git a/src/components/networked-video-player.js b/src/components/networked-video-player.js
index 1f8b1da3e5bb007d817b9a8b9379f0c88c06ccdb..a8c65264266a6988b04aa1618c751c6cedba204f 100644
--- a/src/components/networked-video-player.js
+++ b/src/components/networked-video-player.js
@@ -32,10 +32,12 @@ AFRAME.registerComponent("networked-video-player", {
 
     const v = document.createElement("video");
     v.id = `nvp-video-${ownerId}`;
+    // muted and autoplay so that more restrictive browsers (e.g. Safari on iOS) will actually play the video.
+    v.muted = true;
+    v.autoplay = true;
     v.classList.add(styles.video);
     v.srcObject = new MediaStream(stream.getVideoTracks()); // We only want the video track so make a new MediaStream
     container.appendChild(v);
-    v.play();
 
     this.videoEl = v;