diff --git a/react/features/conference/components/styles.js b/react/features/conference/components/styles.js
index 87e7151d9..7c02a2973 100644
--- a/react/features/conference/components/styles.js
+++ b/react/features/conference/components/styles.js
@@ -1,4 +1,5 @@
 import {
+    BoxModel,
     ColorPalette,
     createStyleSheet,
     fixAndroidViewClipping
@@ -41,16 +42,21 @@ export default createStyleSheet({
     },
 
     /**
-     * The style of the view which expands over the whole conference area and
-     * splits it between both the filmstrip and the toolbox.
+     * The style of the {@link View} which expands over the whole
+     * {@link Conference} area and splits it between the {@link Filmstrip} and
+     * the {@link Toolbox}.
      */
     toolboxAndFilmstripContainer: {
-        bottom: 0,
+        bottom: BoxModel.margin,
         flexDirection: 'column',
         justifyContent: 'flex-end',
-        left: 0,
+        left: BoxModel.margin,
         position: 'absolute',
-        right: 0,
-        top: 0
+        right: BoxModel.margin,
+
+        // Both on Android and iOS there is the status bar which may be visible.
+        // On iPhone X there is the notch. In the two cases BoxModel.margin is
+        // not enough.
+        top: BoxModel.margin * 3
     }
 });
diff --git a/react/features/filmstrip/components/styles.js b/react/features/filmstrip/components/styles.js
index 5e6a1bb75..c18f56987 100644
--- a/react/features/filmstrip/components/styles.js
+++ b/react/features/filmstrip/components/styles.js
@@ -1,5 +1,5 @@
 import { Platform } from '../../base/react';
-import { BoxModel, ColorPalette } from '../../base/styles';
+import { ColorPalette } from '../../base/styles';
 
 /**
  * The base style of {@link Filmstrip} shared between narrow and wide versions.
@@ -54,10 +54,7 @@ export default {
     filmstripNarrow: {
         ...filmstrip,
         alignItems: 'flex-end',
-        height: 90,
-        marginBottom: BoxModel.margin,
-        marginLeft: BoxModel.margin,
-        marginRight: BoxModel.margin
+        height: 90
     },
 
     /**
@@ -66,10 +63,10 @@ export default {
      */
     filmstripWide: {
         ...filmstrip,
-        bottom: BoxModel.margin,
-        left: BoxModel.margin,
+        bottom: 0,
+        left: 0,
         position: 'absolute',
-        top: BoxModel.margin
+        top: 0
     },
 
     /**
diff --git a/react/features/toolbox/components/styles.js b/react/features/toolbox/components/styles.js
index 06273f558..0b42f4c61 100644
--- a/react/features/toolbox/components/styles.js
+++ b/react/features/toolbox/components/styles.js
@@ -111,8 +111,8 @@ export default createStyleSheet({
         ..._toolbar,
         bottom: 0,
         flexDirection: 'column',
-        right: BoxModel.margin,
-        top: BoxModel.margin * 2
+        right: 0,
+        top: 0
     },
 
     /**