apex:panelGrid

Renders an HTML table element in which each component found in the body of the <apex:panelGrid> is placed into a corresponding cell in the first row until the number of columns is reached. At that point, the next component wraps to the next row and is placed in the first cell.

Note that if an <apex:repeat> component is used within an <apex:panelGrid> component, all content generated by the <apex:repeat> component is placed in a single <apex:panelGrid> cell. The <apex:panelGrid> component differs from <apex:dataTable> because it does not process a set of data with an iteration variable.

See also: <apex:panelGroup>

This component supports HTML pass-through attributes using the "html-" prefix. Pass-through attributes are attached to the generated container <table> tag.

<apex:page>
    <apex:panelGrid columns="3" id="theGrid">
        <apex:outputText value="First" id="theFirst"/>
        <apex:outputText value="Second" id="theSecond"/>
        <apex:outputText value="Third" id="theThird"/>
        <apex:outputText value="Fourth" id="theFourth"/>
    </apex:panelGrid>
</apex:page>

<table id="theGrid">
    <tbody>
        <tr>
            <td><span id="theFirst">First</span></td>
            <td><span id="theSecond">Second</span></td>
            <td><span id="theThird">Third</span></td>
        </tr>
        <tr>
            <td><span id="theFourth">Fourth</span></td>
        </tr>
    </tbody>
</table>