I am encountering an issue with my next.js app where the body background color is set to black. Here is the code in globals.css:
body {
background-color: black;
padding: 0;
margin: 0;
font-family: 'Titillium Web', sans-serif;
}
However, when I scroll down past the bottom of the page in the browser, this is what happens:
The background turns purple (which is the background-color of my "Layout.tsx" inside the body).
In Chrome Developer Tools, this is how the body is displayed:
And here is the layout-main loaded from "Layout.tsx" shown in Chrome Developer Tools:
How can I make sure that the black body background extends throughout the entire background, even when I scroll down past the bottom?