Проблема в том, что после основного содержимого сайта идет лишнее пустое пространство
Пробовал оборачивать все содержимое сайта в div и уже этому диву задавать ширину и высоту Пробовал обнулять margin и padding у body и html
Если смотреть через инспектор, то оно показывает что это html, но я убрал у тега html внешние и внутренние отступы
Однако если уменьшить размер страницы через инспектор, то это пустое пространство исчезнет
Вот HTML код:
<!DOCTYPE HTML>
<html>
<head>
<title>Главная страница</title>
</head>
<body>
<div id="site">
<div id="header">
<!--МЕНЮ-->
<nav>
<ul class="menu">
<li><a href="#" onclick="openMenu()"> <span id="buttonMenu">+</span> </a></li>
<ul id="submenu">
<li class="liSubmenu1"><a href="#" class="link" onclick="subSubmenu1()"><span class="nameSubmenu">iPhone</span></a>
<ul id="subSubmenu1">
<li><a href="#" class="subLink1"><span class="element">iPhone 11 Pro</span></a></li>
<li><a href="#" class="subLink1"><span class="element">iPhone 11</span></a></li>
<li><a href="#" class="subLink1"><span class="element">iPhone Xr</span></a></li>
<li><a href="#" class="subLink1"><span class="element">iPhone 8</span></a></li>
</ul>
</li>
<li class="liSubmenu2"><a href="#" class="link" onclick="subSubmenu2()"><span class="nameSubmenu">iPad</span></a>
<ul id="subSubmenu2">
<li><a href="#" class="subLink2"><span class="element">iPad Pro</span></a></li>
<li><a href="#" class="subLink2"><span class="element">iPad Air</span></a></li>
<li><a href="#" class="subLink2"><span class="element">iPad</span></a></li>
<li><a href="#" class="subLink2"><span class="element">iPad mini</span></a></li>
</ul>
</li>
<li class="liSubmenu3"><a href="#" class="link" onclick="subSubmenu3()"><span class="nameSubmenu">Mac</span></a>
<ul id="subSubmenu3">
<li><a href="#" class="subLink3"><span class="element">Macbook Air</span></a></li>
<li><a href="#" class="subLink3"><span class="element">Macbook Pro 13"</span></a></li>
<li><a href="#" class="subLink3"><span class="element">iMac Pro</span></a></li>
<li><a href="#" class="subLink3"><span class="element">Mac Pro</span></a></li>
</ul>
</li>
</ul>
</ul>
</nav>
<!--МЕНЮ-->
<img id="logo" src="images/logo.jpg">
<span id="korzina">Корзина</span>
</div>
</div>
<link rel="stylesheet" href="main_css.css">
<script src="main_script.js"></script>
</body>
</html>
Вот CSS код:
#site {width: 100%; height: 100%; margin: 0; padding: 0}
html {padding: 0; height: 100%; width: 100%; margin: 0;}
body {background-color: white; height: 100%; width: 100%; margin: 0; padding: 0;
font-family: 'SF Pro Display','SF Pro Icons','AOS Icons','Helvetica Neue',Helvetica,Arial,sans-serif; font-weight: normal; font-style: normal}
#header {position: absolute; width: 100%; height: 6%; background-color: black; z-index: 9999}
#buttonMenu {position: absolute; color: white; margin: 7px 90% 0px 17px; font-size: 20px; font-weight: 900}
#logo {position: absolute; margin: 0.5% 49% 90% 49%; width: 25px; height: 25px}
#korzina {position: absolute; margin: 1% 1% 90% 90%; color: white}