PanelGrid

PanelGrid is a container component to create grid based layouts.
Two Column Grid

Three Column Grid

Four Column Grid

Five Column Grid

Multi Row Grid

Responsive

Source

panelGrid.xtml
<h2 class="first">Two Column Grid</h2>
<p:panelGrid columns="2">
    <p:commandButton value="A" type="button"/>
    <p:commandButton value="B" type="button"/>
</p:panelGrid>

<h2>Three Column Grid</h2>
<p:panelGrid columns="3">
    <p:commandButton value="A" type="button"/>
    <p:commandButton value="B" type="button"/>
    <p:commandButton value="C" type="button"/>
</p:panelGrid>

<h2>Four Column Grid</h2>
<p:panelGrid columns="4">
    <p:commandButton value="A" type="button"/>
    <p:commandButton value="B" type="button"/>
    <p:commandButton value="C" type="button"/>
    <p:commandButton value="D" type="button"/>
</p:panelGrid>

<h2>Five Column Grid</h2>
<p:panelGrid columns="5">
    <p:commandButton value="A" type="button"/>
    <p:commandButton value="B" type="button"/>
    <p:commandButton value="C" type="button"/>
    <p:commandButton value="D" type="button"/>
    <p:commandButton value="E" type="button"/>
</p:panelGrid>

<h2>Multi Row Grid</h2>
<p:panelGrid columns="3">
    <p:commandButton value="A" type="button"/>
    <p:commandButton value="B" type="button"/>
    <p:commandButton value="C" type="button"/>

    <p:commandButton value="D" type="button"/>
    <p:commandButton value="E" type="button"/>
    <p:commandButton value="F" type="button"/>

    <p:commandButton value="G" type="button"/>
    <p:commandButton value="H" type="button"/>
    <p:commandButton value="I" type="button"/>
</p:panelGrid>

<h2>Responsive</h2>
<p:panelGrid columns="4" styleClass="ui-responsive">
    <p:commandButton value="A" type="button"/>
    <p:commandButton value="B" type="button"/>
    <p:commandButton value="C" type="button"/>
    <p:commandButton value="D" type="button"/>
</p:panelGrid>