Home/ Questions/Q 706331
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-14T04:09:14+00:00

Should be simple but I couldn’t find the answer, I would like to place

  • 0

Should be simple but I couldn’t find the answer, I would like to place components horizontally instead of vertically.

What I’m trying to achieve is a rich:toolbar with 2 or more rows. I’ve been trying to do that with a toolbar that has a panelgrid and two panelgroups like this:

<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/>

So how do I make the panelgroup layout horizontal (Or should I use something else?)

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You probably already know that JSF in webserver ends up as HTML in webbrowser. In HTML, there are several ways to place elements horizontally (eventually with help of CSS):

    1. Group them in inline elements (like <span> or any element with display: inline;).
    2. Group them in block elements (like <div> or any element with display: block;) and give them all a float: left;.

    The JSF <h:panelGrid> renders a HTML <table> element wherein each child component is taken as a <td>. The columns attribute represents the max amount of <td> elements in a single <tr> (so that the <h:panelGrid> knows when to put a </tr><tr> in). The JSF <h:panelGroup> renders a <span> element.

    To achieve way 1 with JSF, you just need to group them in separate <h:panelGroup> components.

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

    Way 2 can be done the same way, but then with <h:panelGroup layout="block"> instead and a float: left; in their CSS.

    • 0