diff --git a/client/src/components/uis/VideoPlayer.tsx b/client/src/components/uis/VideoPlayer.tsx
index 7e303559..30c8bfbf 100644
--- a/client/src/components/uis/VideoPlayer.tsx
+++ b/client/src/components/uis/VideoPlayer.tsx
@@ -102,9 +102,11 @@ const VideoPlayer: FC<Props> = ({uri, setMediaError}) => {
         style={{
           width: 240,
           height: 150,
+          justifyContent: 'center',
+          alignItems: 'center',
         }}
         useNativeControls
-        resizeMode={ResizeMode.COVER}
+        resizeMode={ResizeMode.CONTAIN}
         onError={() => {
           setMediaError(getString('FAILED_FETCH', {media: getString('VIDEO')}));
         }}