title: React react-fullscreen-image getting images list overlapping
body: <p>I am trying to use the react-fullscreen-image library version 3.0.0 where I have a list of images and by clicking on one of them: the selected image should be opened react-fullscreen-image which works perfectly, the problem here is that I am getting the images overlapping instead of being displayed horizontally as you can see in the picture below:</p>
  <p><a href="https://i.stack.imgur.com/MOujl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MOujl.png" alt="screenshot" /></a></p>
  <p>And here is the code I wrote:</p>
  <pre><code>&lt;ImageGroup&gt;
        &lt;ul&gt;
          {Images.map((image, i)=&gt; (
            &lt;li style={{display:'inline-block'}} key={i}&gt;
              &lt;Image
                src={image.src}
                alt=&quot;nature&quot;  
                style={{
                  position: 'absolute',
                  top: 0,
                  left: 0,
                  right: 0,
                  bottom: 0,
                  height: '100%',
                  width: '100%',
                  objectFit: 'contain',
                  
                }}
              /&gt;
            &lt;/li&gt;
          ))}
        &lt;/ul&gt;
                &lt;/ImageGroup&gt;
  </code></pre>