Is there any way to center elements that use text-align: left and doesn't involve display: inline-block?

I'm creating an epub and when centering the paragraphs through div and inline-block it breaks the page layout (see links with example).

HTML

  <h2 ><a href="indice.xhtml"></a></h2>

  <h3 ></h3>

  <div >
    <div >
      <p ></p>

      <p ></p>

      <p ></p>
    </div>
  </div>

CSS

div.centralizar-div {
    text-align: center;
}

div.estrofe-div {
    display: inline-block;
    text-align: left;
}

How it should be: Book in continuous mode (scroll down)

How it is: Book in single page mode

If anyone can help me :D

CodePudding user response：

try change .estrofe-div p { display: inline-block; text-align : center }

CodePudding user response：

Please try the below css

div.estrofe-div {
    display: flex;
    align-items: center;
   justify-content: center;
}