Mobile width view not rendering correctly

For some reason I cannot display in mobile version my div as 100% width. Here is my JSX code:

<div>
      <div expand="lg" className="login-header">
        <h1>logo</h1>
        <h1>Welcome to Wealth Analytica</h1>
        <h1>Back to site</h1>
      </div>
          /******HERE IS SOME OTHER CODE THAT IS NOT RELATED*******/
</div>

And my css is:

  .login-header {
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
  justify-content: space-between;
  text-align: center;
  background-color: #343a40;
  width:100%;
}

Mobile view is not as expected:

enter image description here

The ordinary view is OK. My meta tag is:

<meta name="viewport" content="width=device-width, initial-scale=1" />

Can someone give advice? I tried several different things but without success.