2010-03-31 3 views
5

간단해야하지만 대답을 찾을 수 없으므로 컴포넌트를 수직으로 배치하지 않고 수평으로 배치하고 싶습니다.JSF에서 컴포넌트의 수평 배치

나는 두 가지 이상의 행이있는 rich : toolbar입니다. 나는이 같은 panelgrid 두 panelgroups있는 도구 모음으로 그렇게 노력했습니다 : 나는 panelgroup 레이아웃은 수평하게 어떻게 그래서

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

을 (아니면 다른 뭔가를 사용해야합니까?)

감사!

답변

4

웹 서버의 JSF가 웹 브라우저에서 HTML로 끝나는 것을 이미 알고있을 것입니다.

  1. 그룹들을 인라인 요소 (같은 <span> 또는 display: inline;있는 모든 요소) : HTML에서, (결국 CSS의 도움으로) 수평 요소를 배치하는 방법에는 여러 가지가있다.
  2. 그룹은 그들을 블록 요소 (또는이 같은 <div>display: block; 어떤 요소) 그들에게 float: left; 모두를 제공한다.

는 JSF <h:panelGrid> 각각의 자식 구성 요소는 <td>으로 간주되는 것을 특징 <table> HTML 요소를 렌더링한다. columns 속성은 최대 <td> 개의 요소를 하나의 <tr> 단위로 나타냅니다. <h:panelGrid>은 언제 </tr><tr>을 넣을 지 알고 있습니다. JSF <h:panelGroup><span> 요소를 렌더링합니다.

JSF로 1을 수행하려면 별도의 <h:panelGroup> 구성 요소로 그룹화하면됩니다.

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

방법 2는하지만 대신 <h:panelGroup layout="block">과 CSS에 float: left;과 같은 방법을 수행 할 수 있습니다.

+0

좋아요! 교육용 부분을 추가해 주셔서 감사합니다. 나는 JSF에서 스스로 가르치기 때문에 많은 기초를 놓치고있다 ... – Ben