How to align <h: panelGrid> itself NOT the elements in the center?

Question

When I use this code snippet

<h:panelGrid id="myGrid" columns="1" rendered="#{myBean.showResults}" width="50%" border="1" style="text-align: center;"> 

Panel items will be centralized
BUT
I want to centralize h: panelGrid on its own in the center of my XHTML page
Like this html code

 <table id="myGrid" border="1" align="center"> 

Answer 1

Provided that it has a known width, give it the left and right margin auto . Thus, it will center itself relative to the element of the parent block.

 <h:panelGrid ... style="margin: 0 auto;"> 

See also:

• Center a div in CSS

Answer 2

wrap it in a panel that is the size of your page, and set the parent grid style to the center of the text alignment. Then your child grid will focus on the page (remove the text-align: center style from your child panel screen