particles.js + bootstrap 4.6 white spaces in mobile version

Question

I use particles.js like this:

    <div id="particles-js"></div>
@RenderSection("Header", required: false)
<main role="main" class="container">
    @RenderBody()
</main>
<script>
    particlesJS.load('particles-js', '/Scripts/Custom/particles.json', function () {
        console.log('callback - particles.js config loaded');
    });
</script>

And only in mobile version i have that issue:

Please tell me how to fix that, in white space no any tags or something else.

Answer 1

This is the answer for my question.

#particles-js{
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: #000;
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.body-particles{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}