Не могу прокручивать страницу в React JS ⇐ Html

[Anonymous]

Я делаю свой первый проект с React и обнаружил проблему. Я не могу прокрутить страницу. Я попытался добавить переполнение изменяющихся размеров etx. Но все же ничего < /p>

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

import BookComp from "./BookComp.jsx";
import { useState, useEffect } from "react";
import "./css/App.css";
import { getBook } from "./Api.js";

function App() {
const [books, setbooks] = useState([]);
const [click, setClick] = useState(0);
const [searchFetch, setSearchFetch] = useState({});
useEffect(() => {
getBook(searchFetch).then((result) => {
setbooks(result);
});
}, [click]);
return (


 {
setSearchFetch({ text: e.target.value });
}}
/>
 setClick((c) => c + 1)}
>
asdad


{books.map((bok) => (

))}



);
}

export default App;
< /code>
Это мой файл JS < /p>
body {
margin: 0;
width: 100%;
min-height: 100vh;
position: relative;
}

< /code>
index.html файл css < /p>
.navbar {
position: fixed;
top: 0;
left: 0; /* Ensure it starts from the very left */
width: 100vw; /* Use viewport width to cover the entire screen */
background-color: #46617b; /* Slightly darker gray background */
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
z-index: 1000; /* Ensure it stays on top */
height: 70px; /* Increased height */
padding: 0 20px; /* Optional: Add horizontal padding */
}

.inputfield {
position: absolute;
right: 150px; /* Adjusted to move it a bit left */
top: 50%;
transform: translateY(-50%);
border-radius: 8px;
transition: all 0.3s ease;
font-size: 18px;
padding: 10px 15px;
}

.searchButton {
position: absolute;
right: 50px;
top: 50%;
transform: translateY(-50%);
padding: 10px 15px;
border-radius: 8px;
font-size: 18px;
cursor: pointer;
}

.grid {
display: grid;
grid-template-columns: repeat(2, 1fr); /* Ensure only 2 objects per line */
gap: 1.5rem;
padding: 1rem;
width: 100%;
box-sizing: border-box;
margin-top: 70px; /* Push the grid content below the navbar */
}

.home {
box-sizing: border-box;
}

Это файл css
Я попытался изменить высоту дома на 150vh, и это была единственная ситуация, когда появилась полоса прокрутки, но она не прокручивала страницу

Подробнее здесь: https://stackoverflow.com/questions/795 ... n-react-js