2017-11-28 1 views
1

slectOnMenu 구성 요소가 있습니다 .ui-selectonemenu, ui-selectonemenu-을 재정의 한 후 width:120% !important;을 스타일로 설정하여 slectOnMenu의 너비를 변경하려하지만 레이블 만 변경되었습니다 어떻게 이동시킬 수 있습니까? 방아쇠를 당겨도? 아래의 흰색 영역과 같이 selectOneMenu 너비를 변경하고 싶습니다.<p : selectOneMenu>의 너비를 변경합니다

CSS

   <h:form id="rqScannerForm"> 
       <style type="text/css"> 
        .ui-selectonemenu{width: 120% !important;} 
        .ui-selectonemenu-label{width: 120% !important;} 
       </style> 
        <p:selectOneMenu style="width: 120% !important;}" scrollHeight="150" 
        value="#{viewEventStatusController.eventStatusId}" disabled="#{!eventStatusController.isEntityEditable}" autoWidth="false" > 
        <f:selectItems value="#{viewEventStatusController.eventStatusList}" var="eventStatus" itemValue="#{eventStatus.id}" itemLabel="#{eventStatus.objectId}" /> 
        </p:selectOneMenu> 
       </h:form> 

스크린 샷 enter image description here

+0

가능한 복제 [I 사용자 지정 스타일 기본 PrimeFaces의 CSS를 대체 ​​어떻게해야합니까?] (HTTPS :/당신은 픽셀이 더 있으려면

.ui-selectonemenu { min-width: 120px !important; } 

를 사용하는 것을 의미하는 경우 픽셀 대신에 그들을 사용하는 반응-저장 /stackoverflow.com/questions/8768317/how-do-i-override-default-primefaces-css-with-custom-styles) – Kukeltje

답변

1
.ui-selectonemenu { 
    min-width: 50% !important; 
} 

그냥 인식이 만드는 폭이 더 큰 다음 100 % 레이아웃 캔 엉망. 나는 100 % 더 큰 것을 사용 해본 적이 없다!.

.ui-selectonemenu { 
    min-width: 8em !important; 
} 
+0

가장 좋은 제안은 아닙니다 (실제로는별로 좋지 않습니다). 중요한 것을 사용하지 마십시오. 최후의 수단으로 만 사용하십시오. CSS 특이성에 대해 자세히 알아보십시오! – Kukeltje

+0

@Kukeltje 더 나은 것을 제공하십시오 .--) 매우 구체적입니다 .--) –

+0

복제본보기 – Kukeltje

관련 문제