데이터리스트 아이템을 오버 플로우시키는 방법?

Question

데이터리스트가 있습니다 (primeface 일 수 있지만, 보이는 데이터리스트와 동일한 문제점이 있습니다). 이 페이지의 한 사례에서 데이터리스트는 100 개 정도의 회원을 보유하고 있습니다. 나는 그들 모두를 보여줄 필요가 없다. 오버플로 랜드 (Overflow Land)에 한꺼번에 모든 것을 강제로 적용하고 CSS "text-overflow : 줄임표"를 사용하고 싶습니다. 사용자에게 표시합니다. 다양한 최대 폭, 최대 높이 유형의 특성을 시도했습니다. 아무것도 효과가 없습니다.

FTR은 - 우리가 JSF 2.2에있는/Primefaces 6.0/JPA 2

나는 resultList을 제한하는 쿼리 목록을 백업 할 수 있지만, 나는 오히려 프론트 엔드에이 문제를 해결할 것입니다. 그게 최선의 방법인가요? 가능한가?

내 코드는 이것이다 :

<p:dataList value="#{off.v4Segments(officeId)}" var="_seg" > 
    <h:outputText value="#{_seg.segment}" /> 
</p:dataList> 

그것은이 같은 렌더링 : 부모에 추가 할

<div class="ui-datalist ui-widget office-segments" id="j_idt70:j_idt91:j_idt111"> 
    <div class="ui-datalist-content ui-widget-content" id="j_idt70:j_idt91:j_idt111_content"> 
    <ul class="ui-datalist-data" id="j_idt70:j_idt91:j_idt111_list"> 
     <li class="ui-datalist-item"><span class="off-seg">0G16</span></li> 
     <li class="ui-datalist-item"><span class="off-seg">0G18</span></li> 
     <li class="ui-datalist-item"><span class="off-seg">0G88</span> 
     .... 
    </ul> 
    </div> 
</div 

Answer 1

시도는 다음과 같은 CSS 속성 div에 : 경우

max-height: 100px; 
overflow-y:hidden; 

당신 100px보다 큰 요소가 있습니다. 표시되지 않습니다.

이것 좀 봐 : 완벽하게 작동 http://jsfiddle.net/ns0pukh9/