I am designing a webpage for a desktop using react-bootstrap. I have in my webpage logo, Main heading and form, and some links after the display of the form, I want to display all my content in the center of the webpage. How can I accomplish it using bootstrap flexbox
You can give the most parent div or element in your app a className and apply flexbox properties to it.
const App = () => {
return (
<div className='d-flex align-items-center justify-content-center'>...</div> // <--------Most parent div-------->
)
}
If you only want to center the content horizontally then only apply justify-content otherwise apply both.