title: center align all the p tags inside div
body: <p>This is my code, I want to center align all the p tags inside the div in all the media screen sizes. How do i do that?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;div id="thankyou_block"&gt;
          &lt;p&gt;&lt;br&gt;&lt;/p&gt;
          &lt;p&gt;&lt;br&gt;&lt;/p&gt;
          &lt;div class="ticket_details"&gt;
              &lt;p style="font-weight: 500;"&gt;Your concern !&lt;/p&gt;
              &lt;p class="case_num" style="font-weight: 500;"&gt;Please find the details: Ticket&lt;span id="case_id"&gt;&lt;/span&gt;&lt;/p&gt;
              &lt;p&gt;We will take time to review your concern and take necessary actions if needed&lt;/p&gt;
          &lt;/div&gt;
  
          &lt;img id="thankyou_img"
              src="thankyou_opendoor.png"&gt;
          &lt;div style="display: flex; align-items: center; justify-content: center; margin-top: 30px;"&gt;
              &lt;button id="back_to_portal" onclick="back_to_portal()"&gt;Back&lt;/button&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>