Пустое пространство на HTML CSS JS ⇐ Javascript

[Anonymous]

Моя цель состоит в том, чтобы создать веб -сайт, который реализует горизонтальный прокрутку с использованием GSAP, особенно в разделах #Home и #features. Вот почему я поместил их бок о бок, используя Flex Row, простирающуюся за пределы просмотра. Это действительно разочаровывает для меня.
Image Image
кажется, что ширина в 3 раза больше, чем Viewport (как я и хотел), но высота также в 3 раза больше. < /P>
Вот и избавление от этого пространства. Я попробовал несколько подходов, используя инструмент Expect Element, но я не мог найти ни одного тега, указывающего на пустое пространство. Высота установлена ​​на 100dvh, но пустое пространство все еще появляется за пределами этого 100 дВ.

Код: Выделить всё

.section-wrapper {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
width: 300vw;
}

section {
padding: 0 164px;
}

#home, #features {
height: 100%;
flex: 0 0 100vw;
}

#home-section {
padding-top: 112px;
height: calc(100% - 112px);
position: relative;
}

.hero-home-wrapper {
display: flex;
flex-direction: column;
gap: 42px;
}< /code>



[img]../assets/images/lock.png[/img]

A New Era of Cyber Defense
for a Safer and Smarter
class="br-desktop"> Digital Future.
[h4]
Defendora is a smart cybersecurity solution that
keeps your applications and data safe with
real-
time
protection anytime, anywhere.
[/h4]

Get Protected
Try free


Protecting over 100,000 computers — Globally.





/// same as home-section...


 

Подробнее здесь: https://stackoverflow.com/questions/797 ... tml-css-js