我可以向下滚动,但没有内容



所以我的问题是,即使没有内容,也可以向下滚动。就像是一片空白。这是我的代码:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
<title>Mr.Shisha | Homepage</title>
</head>
<body>
<div align="center">
<h1 style="font-size: 112px;">Mr. Shisha</h1>
</div>
<nav>
<div style="position: relative; left: 650px;"class="dropdown">
<a href="index.html"><button class="dropbtn">Shishas</button></a>
<div style="position relative; left: -40px;"class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
</div>
</div>
<div style="position: relative; left: 700px;"class="dropdown">
<a href="index.html"><button class="dropbtn">Tabak</button></a>
<div style="position relative; right: -40px;"class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
</div>
</div>
<div style="position: relative; left: 750px;"class="dropdown">
<a href="index.html"><button class="dropbtn">Kohle</button></a>
<div style="position relative; left: -40px;"class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
</div>
</div>
<div style="position: relative; left: 800px;"class="dropdown">
<a href="index.html"><button class="dropbtn">Bongs</button></a>
<div style="position relative; left: -40px;"class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
</div>
</div>
<div style="position: relative; left: 850px;"class="dropdown">
<a href="index.html"><button class="dropbtn">Zubehör</button></a>
<div style="position relative; left: -40px;"class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
</div>
</div>
</nav>
<div style="position: relative; left: 1815px;"class="div1"></div>
<div class="round" style="; position: relative; bottom: 340px; left: 1825px;">
<a href="https://facebook.com/mr.shisha11" target="_blank"><img src="p/f.png" width="80px"></a></div>
<a style="position: relative;left: 1825px; bottom: 310px;"href = "mailto: mr.s@yahoo.com"><img src="p/e.png" width="80px"></a>
<div style="position: relative; bottom: 270px; left: 1825px;">
<a href="https://www.google.com/maps?cid=9446396123572628496" target="_blank"><img src="p/s.png" width="80px"></a></div>
<img class="img1" src="p/wi.gif">
<div style="position: relative; bottom: 1250px; left: 20px;"class="div2"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</body>

我不擅长HTML/CSS,我知道。我在网上找不到关于那个问题的任何信息。当您使用太多div或类似的东西时,会发生这种情况吗?或者我的CSS有问题,我的HTML还好吗?编辑:这是netlify链接:https://jolly-roentgen-d0fc0f.netlify.com/

至少有一个地方有问题

<div style="position: relative; bottom: 1250px; left: 20px;"class="div2"></div>

删除这个底部:1250px和所有其他底部,你有,我想你不会有滚动问题任何

最新更新