title: Right alignment inside a p:column holding a p:panelGrid
body: <p>Given the following <code>&lt;p:panelGrid&gt;</code>.</p>
  
  <pre><code>&lt;p:panelGrid style="width: 25%;"&gt;
      &lt;p:row&gt;
          &lt;p:column style="text-align: right;"&gt;
              a
          &lt;/p:column&gt;
      &lt;/p:row&gt;
  &lt;/p:panelGrid&gt;
  </code></pre>
  
  <p>The text inside <code>&lt;p:column&gt;</code> is aligned right as can be seen below.</p>
  
  <p><img src="https://i.stack.imgur.com/kyyep.png" alt="enter image description here"></p>
  
  <p>I need to display another <code>&lt;p:panelGrid&gt;</code> inside that <code>&lt;p:column&gt;</code> as follows.</p>
  
  <pre><code>&lt;p:panelGrid style="width: 25%;"&gt;
      &lt;p:row&gt;
          &lt;p:column style="text-align: right;"&gt;
              &lt;p:panelGrid&gt;
                  &lt;p:row&gt;
                      &lt;p:column&gt;
                          b
                      &lt;/p:column&gt;
                  &lt;/p:row&gt;
              &lt;/p:panelGrid&gt;
          &lt;/p:column&gt;
      &lt;/p:row&gt;
  &lt;/p:panelGrid&gt;
  </code></pre>
  
  <p>The style attribute <code>text-align: right;</code> of <code>&lt;p:column&gt;</code> has no effect in this case.</p>
  
  <p><img src="https://i.stack.imgur.com/oiFpP.png" alt="enter image description here"></p>
  
  <p>How to align the inner <code>&lt;p:panelGrid&gt;</code> right?</p>