5 files changed, 12 insertions, 30 deletions
diff --git a/src/sass/base.scss b/src/sass/base.scss
index 9bb9d98a..2aefd909 100644
--- a/src/sass/base.scss
+++ b/src/sass/base.scss
@@ -5,11 +5,13 @@
 // Base
 .plyr {
     @include plyr-font-smoothing($plyr-font-smoothing);
-
+    align-items: center;
     direction: ltr;
+    display: flex;
     font-family: $plyr-font-family;
     font-variant-numeric: tabular-nums; // Force monosace-esque number widths
     font-weight: $plyr-font-weight-regular;
+    height: 100%;
     line-height: $plyr-line-height;
     max-width: 100%;
     min-width: 200px;
@@ -19,10 +21,11 @@
 
     // Media elements
     video,
-    audio {
+    audio,
+    iframe {
         border-radius: inherit;
-        height: auto;
-        vertical-align: middle;
+        display: block;
+        height: 100%;
         width: 100%;
     }
 
diff --git a/src/sass/components/controls.scss b/src/sass/components/controls.scss
index 8abee204..cc07ef7f 100644
--- a/src/sass/components/controls.scss
+++ b/src/sass/components/controls.scss
@@ -41,14 +41,6 @@
         &.plyr__time + .plyr__time {
             padding-left: 0;
         }
-
-        &.plyr__volume {
-            padding-right: ($plyr-control-spacing / 2);
-        }
-
-        &.plyr__volume:first-child {
-            padding-right: 0;
-        }
     }
 
     // Hide empty controls
diff --git a/src/sass/components/video.scss b/src/sass/components/video.scss
index fdcf4f2d..ef70c104 100644
--- a/src/sass/components/video.scss
+++ b/src/sass/components/video.scss
@@ -15,8 +15,11 @@
 .plyr__video-wrapper {
     background: #000;
     border-radius: inherit;
+    height: 100%;
+    margin: auto;
     overflow: hidden;
     position: relative;
+    width: 100%;
     // Require z-index to force border-radius
     z-index: 0;
 }
@@ -33,12 +36,9 @@ $embed-padding: ((100 / 16) * 9);
 .plyr__video-embed iframe,
 .plyr__video-wrapper--fixed-ratio video {
     border: 0;
-    height: 100%;
     left: 0;
     position: absolute;
     top: 0;
-    user-select: none;
-    width: 100%;
 }
 
 // If the full custom UI is supported
diff --git a/src/sass/components/volume.scss b/src/sass/components/volume.scss
index 82a6dd36..8afd76b0 100644
--- a/src/sass/components/volume.scss
+++ b/src/sass/components/volume.scss
@@ -5,11 +5,11 @@
 .plyr__volume {
     align-items: center;
     display: flex;
-    flex: 1;
     position: relative;
 
     input[type='range'] {
         margin-left: ($plyr-control-spacing / 2);
+        margin-right: ($plyr-control-spacing / 2);
         position: relative;
         z-index: 2;
     }
@@ -22,16 +22,3 @@
         max-width: 110px;
     }
 }
-
-// Hide sound controls on iOS
-// It's not supported to change volume using JavaScript:
-// https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html
-.plyr--is-ios .plyr__volume {
-    display: none !important;
-}
-
-// Vimeo has no toggle mute method so hide mute button
-// https://github.com/vimeo/player.js/issues/236#issuecomment-384663183
-.plyr--is-ios.plyr--vimeo [data-plyr='mute'] {
-    display: none !important;
-}
diff --git a/src/sass/states/fullscreen.scss b/src/sass/states/fullscreen.scss
index 5632a60f..73dffd29 100644
--- a/src/sass/states/fullscreen.scss
+++ b/src/sass/states/fullscreen.scss
@@ -24,8 +24,8 @@
 // Fallback for unsupported browsers
 .plyr--fullscreen-fallback {
     @include plyr-fullscreen-active();
-
     bottom: 0;
+    display: block;
     left: 0;
     position: fixed;
     right: 0;