title: How to set "text-align" to its default value (disable "text-align" inheritance)
body: <p>In a specific part on my document (a novel) I have a block of text that most be centered but not its content. For this, I used:</p>
  
  <pre><code>&lt;div class="center"&gt;
      &lt;div class="inline-block"&gt;
          &lt;p class="left"&gt;Some text&lt;/p&gt;
          &lt;p class="left"&gt;More text&lt;/p&gt;
          &lt;p class="left"&gt;Even more text&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;style&gt;
  .center {
      text-align: center;
  }
  
  .inline-block {
      display: inline-block;
      width: /* sometimes I specify it, others I let the biggest paragraph do it by itself  */;
  }
  
  .left {
      text-align: left;
  }
  &lt;/style&gt;
  </code></pre>
  
  <p>Overall, I am satisfied with this solution. But, as you can see, I need to use the class “.left” to avoid paragraphs to inherit the centered value of their parent div. The thing is that I don’t want to set the justification (justified/left) of my document; I want the user (or the default browser/app/epub reader/etc.) to set it instead. The problem is that if I don’t add this class “.left”, the paragraphs will inherit the centered value.</p>
  
  <p>Is there a way to make this paragraphs have a “default” value (either justified or left)? ¿Can I achieve the same overall design using other elements/styles? Can I disable the inheritance for this paragraphs by any means?</p>
  
  <p>I have tried things that included “transform: translateX(-50%)”, “display: table”, setting the paragraphs to “value: initial;”, mixing pseudo-classes/attribute selectors… Basically, everything I could to see if I can trick my way through. So far nothing works. Any ideas?</p>