Попытка центрировать столбец внутри контейнера в HTML CSS, CSS не работает

Question

Я пытаюсь центрировать колонку внутри контейнера, но он уходит в сторону. я пробовал css свойства, что я делаю не так? Я уменьшил ширину контейнера абзаца до 650px или где-то 70%, он становится левосторонним, когда я устанавливаю ширину.

   <letstalk>
<div className="container">
  <div className="row">
     <h1>Escape is not his plan.
       I must face him, alone.</h1>
       <div className="col">
      <p className="textcontent"> As you wish. I can't get involved! I've got work to do! 
        It's not that I like the Empire, I hate it, but there's nothing 
        I can do about it right now. It's such a long way from here. Alderaan? 
        I'm not going to Alderaan.
        I've got to go home. It's late, I'm in for it as it is.</p>
        </div>
      <button type="button" class="btn btn-primary">Let's Talk</button>
  </div>
</div>

`` ``

// css

letstalk {
 height: auto;
 background: #2D2828;
 display: flex;
 justify-content: center;
 color: white;
 padding: 50px;
 .container{
     justify-content: center;
     text-align: center;
      }
      .textcontent {
          max-width: 650px;
      }

}

Это экран

Я хочу, чтобы этот абзац был по центру, а не по левой стороне. Я установил ширину 60% или 650px, только для этого абзаца. Может кто-нибудь помочь мне, что я сделал не так?

Answer 1

, если display: block и родительский блок не имеет никакого эффекта - margin: 0 auto иначе установить родительский блок display: flex; justify-content: center

Answer 2

добавить маржу, я добавил 5px

.textcontent {
      max-width: 650px;
      margin: 5px auto;
  }

Answer 3

добавить поле: 0 авто; к этому классу

.textcontent {
          max-width: 650px;
          margin:0 auto;
 }

.textcontent