Colocación horizontal de los componentes en JSF

Question

Debería ser simple pero no pude encontrar la respuesta, me gustaría colocar los componentes horizontalmente en lugar de verticalmente.

Lo que estoy tratando de lograr es una barra de herramientas rica: con 2 o más filas. He estado tratando de hacer eso con una barra de herramientas que tiene un panelGrid y dos panelgroups así:

<rich:toolbar...> 
    <f:panelgrid columns="1"...> 
    <f:panelgroup id="row1" .../> <-- Should be horizontal placement 
    <f:panelgroup id="row2" .../> <-- Should be horizontal placement 
    <f:panelgrid/> 
<rich:toolbar/> 

Entonces, ¿cómo hago que la disposición panelgroup horizontal (O debería usar algo más?)

¡Gracias!

Answer 1

Probablemente ya sepa que JSF en el servidor web termina como HTML en el navegador web. En HTML, hay varias maneras de colocar los elementos en horizontal (finalmente con ayuda de CSS):

1. agruparlos de elementos en línea (como <span> o cualquier elemento con display: inline;).
2. Grupo en elementos de bloque (como <div> o cualquier elemento con display: block;) y darles toda una float: left;.

El JSF <h:panelGrid> renders un elemento HTML <table> en el que cada componente secundario se toma como una <td>. El atributo columns representa la cantidad máxima de elementos <td> en un solo <tr> (para que el <h:panelGrid> sepa cuándo poner un </tr><tr> en). El JSF <h:panelGroup> representa un elemento <span>.

Para lograr el modo 1 con JSF, solo necesita agruparlos en componentes separados <h:panelGroup>.

<rich:toolbar ...> 
    <h:panelgroup id="row1" ... /> 
    <h:panelgroup id="row2" ... /> 
</rich:toolbar> 

manera 2 se puede hacer de la misma manera, pero luego con <h:panelGroup layout="block"> lugar y una float: left; en su CSS.