Reports

I want to show you two methods. Both methods fulfill your request. You can choose the one you need. We add the flex property and justifiy-content:center properties as display. Thus, your form is placed in the center.

First, wrap your container class with a container div. Make a css assignment to it. The example is in the code below.

React Code:

return (
<div className='wrapper'>
    <div className={`container ${addClass}`} id='container'>
          //your codes
       </div>
 </div>
)

CSS code:

  .wrapper{    
    display:flex;
    justify-content: center;
  }

The second method is that since your container class is already in a root, you can apply this css on the root without add any wrapper.

CSS Code

  #root{    
    display:flex;
    justify-content: center;
  }

79183590