jsf - Correct layout of h:outputLabel and rich:combobox components on same line -

with richfaces, how can h:outputlabel , rich:combobox components display directly adjacent each other on same line?

here 2 approaches i've tried.

---

#1 rich:layout
first tried using rich:layout & rich:layoutpanel, components appear on separate lines. here's code:

<rich:layout>   <rich:layoutpanel position="left" width="100%">     <h:outputlabel for="timespanunitscombo2" value="time span " />     <rich:combobox id="timespanunitscombo2" value="#{bean.timespanunitslabel}" enablemanualinput="false">              <f:selectitems value="#{bean.timespanunitslist}" />     </rich:combobox>   </rich:layoutpanel> </rich:layout> 

and here's rendered output:

---

#2 h:panelgrid
next tried using h:panelgrid, again no success - components evenly spaced on available area, instead of being directly adjacent , left-aligned intended. here's code:

<h:panelgrid columns="2">   <h:outputlabel for="timespanunitscombo3" value="time span " />   <rich:combobox id="timespanunitscombo3" value="#{bean.timespanunitslabel}" enablemanualinput="false">            <f:selectitems value="#{bean.timespanunitslist}" />   </rich:combobox> </h:panelgrid> 

and here's rendered output:

---

component layout richfaces proving thoroughly frustrating. i'll give second prize has references on layout richfaces. :)

this can done many ways. 1 of them use fragment

<s:fragment>       <h:outputtext value="time span" />       <rich:combobox id="timespanunitscombo2" value="#{bean.timespanunitslabel}" enablemanualinput="false">                    <f:selectitems value="#{bean.timespanunitslist}" />       </rich:combobox> </s:fragment> 

or can use div instead of fragment. <div> code...</div>