Cómo alinear los componentes JSF al centro

Question

En mi aplicación web JSF 2 - Primefaces 3, estoy usando <p:panelGrid> y <p:panel>. Tengo varios componentes dentro de ellos que quedan justificados. Necesito que todos estén alineados en el centro. ¿Cómo podemos hacer esto? Intenté usar div pero no funciona.

Answer 1

Mire la salida HTML generada y modifique CSS en consecuencia.

Si el elemento HTML, que desea es un centro de block element (<div>, <p>, <form>, <table>, etc, o forzados por display: block;), entonces primero hay que darle una anchura conocida y entonces usted puede centrar es relativo a su elemento de bloque primario usando CSS margin: 0 auto; en el elemento mismo.

Si el elemento HTML, que desea Center es un inline element (<span>, <label>, <a>, <img>, etc, o forzada por display: inline;), entonces usted puede centrarla usando CSS text-align: center; en su elemento de bloque padre.

Answer 2

Estamos utilizando RichFaces, pero la solución que utilizamos en este caso también puede aplicarse a Primefaces. Solíamos estilizar los elementos internos con css.
Una vez que represente la página en el navegador, puede buscar el código fuente y averiguar qué elementos HTML se representan. A continuación, cree clases CSS específicas y estiloe todo el panel o los elementos internos en panelGrid para esa clase.

La mayoría de las veces, esta fue la solución más fácil y también suficiente.

Answer 3

Inténtalo con CSS y p:panelGrid columnClasses atribuyen:

<p:panelGrid columnClasses="centered"> ... </p:panelGrid> después en su hoja de estilo crear una clase como:

.centered { text-align: center; }

Si tiene componentes de su columna p:panelGrid que no sea sólo texto, añadir el atributo de margen para su clase css:

.centered { text-align: center; margin-left: 50%; }

Answer 4

Si desea establecer el contenido de un PrimeFaces: panelGrid para centrar puede probar esto:

<h:panelGrid column="1"> 

    <h:panelGroup style="display:block; text-align:center"> 

      your contents... 

    </h:panelGroup> 

</h:panelGrid>