I am a newcomer to Bootstrap and React JS, and I am facing the challenge of centering my app both vertically and horizontally. Currently, the app is only centered horizontally and seems to be attached to the top.
function App() {
return (
<GlobalContextProvider>
<div className="container">
<div className="row justify-content-center align-items-center"> // <--- Doesn't seem to work
<div className="col">
<Header />
<Main />
<Footer />
</div>
</div>
</div>
</GlobalContextProvider>
);
}
I have explored different solutions such as "my-auto," "align-self-center," and others, but unfortunately nothing has worked for me so far. Can anyone provide assistance with this issue (without resorting to custom CSS)?