Reactで画面いっぱいに画像を表示したい

実現したいこと

初めの画面いっぱいに画像を表示したい

前提

Reactでホームページを作っています
サイトを開いたときに画面いっぱいに画像を出したい(スライドショーのように)と思いコーディングをしていました。

発生している問題・エラーメッセージ

上下左右に隙間が少し空いてしまう

該当のソースコード

jsx
1import React from 'react';
2import { Fade } from 'react-slideshow-image';
3import 'react-slideshow-image/dist/styles.css';
4
5const fadeImages = [
6  {
7    url: './img/home/img1.webp',
8    caption: 'First Slide'
9  },
10  {
11    url: './img/home/img2.webp',
12    caption: 'Second Slide'
13  },
14  {
15    url: './img/home/img3.webp',
16    caption: 'Third Slide'
17  },
18];
19
20const Slideshow = () => {
21  const fadeProperties = {
22    duration: 2000,//2s
23    transitionDuration: 1500,
24    infinite: true,
25    indicators: false,
26    arrows: false,
27  };
28
29  return (
30      <Fade {...fadeProperties}>
31        {fadeImages.map((fadeImage, index) => (
32          <div key={index}>
33            <img style={{  padding: 0, width: '100vw', height: '100vh' }} src={fadeImage.url} alt={fadeImage.caption} />
34          </div>
35        ))}
36      </Fade>
37  );
38};
39
40export default Slideshow;
41