Почему на моем сайте появляется пробел при открытии в браузере с вертикальными вкладками? ⇐ CSS

[Anonymous]

Итак, с веб-сайтом, который я создаю, постоянная проблема, которая представляет собой постоянный пробел в нижней части моего div, сколько бы я ни исправлял отступы или поля, он остается, это заставило меня поверить, что, возможно, дело не в отступах или полях.
как это выглядит в моем обычном браузере
Я уже пробовал открыть его в другом браузере, похоже, проблема в типе Расположение вкладок в браузере. Обычно я загружаю вкладки вертикально слева. Затем я попробовал открыть его в другом браузере, оказалось, что если вкладки расположены горизонтально вверху, пробел исчезает.
Чтобы уточнить, я обычно использую браузер Brave с настройкой вертикальных вкладок, и я попробовал это в Chrome, где по умолчанию используются горизонтальные вкладки, расположенные вверху.
html:





Open








CSS:
body {
background-image: url('https://file.garden/aG3rdTNO_Dlar7-g/back.png');
background-size: cover;
margin: 0;
padding: 0;
height: 100vh;
width: 100vw;
overflow: hidden;
}

.body {
margin: 0 auto;
height: 100%;
width:77.396vw;
position: relative;
background-repeat: no-repeat;
overflow:hidden;
background-size: contain;
background-image: url('https://file.garden/aG3rdTNO_Dlar7-g/ho ... 20book.png');
}


Подробнее здесь: https://stackoverflow.com/questions/797 ... tical-tabs