Search code examples
cssjsfprimefacespanel

How to align PanelGrid to center? JSF-Primefaces


I know that there are many questions about this issue, but nothing worked for me properly.

I need to align my PanelGrid to center(horizontal).

this is my panelgrid

<p:panelGrid styleClass="panelGridCenter">

and my CSS:

.panelGridCenter td,.panelGridCenter tr {
    text-align: center;
}

It just aligns the content to center, but not the panelGrid


Solution

  • The JSF <p:panelGrid> component renders a HTML <table> element which is by default a block level element. To center the block level element itself, you should set its horizontal margin to auto instead of attempting to center its inline contents.

    .panelGridCenter {
        margin: 0 auto;
    }
    

    See also: