title: PrimeFaces: change the default height of the selectOneMenu label border
body: <p>I am trying to change the default height to the selectOneMenu (the border of the label too) component in PrimeFaces but I am facing problem that the border is not being changed. How can I change the default height of the selectOneMenu label border?</p>
  
  <p><strong>CSS Code</strong></p>
  
  <pre><code>&lt;style type="text/css"&gt;                    
     .selectOperationOneMenu.ui-selectonemenu {
        min-width: 30% !important;
       margin-top: 20px;
     }
     .selectOperationOneMenu.ui-selectonemenu .ui-selectonemenu-label {
        height: 25px !important;
        line-height: 25px !important;
     }
     .selectOperationOneMenu.ui-selectonemenu .ui-selectonemenu-trigger {
        height: 25px !important;
     }                    
  &lt;/style&gt;
  </code></pre>
  
  <p><strong>PrimeFaces xhtml code</strong></p>
  
  <pre><code>&lt;p:selectOneMenu id="selectOneMenu"  
                   scrollHeight="100" 
                   value="#{viewEventStatusController.operationId}" 
                   autoWidth="false"
                   style="#{componentUnit.style}" 
                   styleClass="selectOperationOneMenu" 
                   disabled="#{!chat.valid}" 
                   rendered="#{componentUnit.type == 'selectOneMenu'}"&gt;
    &lt;f:selectItems value="#{viewEventStatusController.convertJsonToList(chat.operations)}"
                   var="operation" 
                   itemValue="#{viewEventStatusController.getOperationIndex(operation)}"
                   itemLabel="#{operation}" /&gt;
    &lt;p:ajax event="change"
            update="@form"
            resetValues="true" 
            listener="#{viewEventStatusController.changeSelectOnMenueOperation(chat, componentUnit)}" /&gt;
  &lt;/p:selectOneMenu&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/xLqXx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/xLqXx.png" alt="enter image description here"></a></p>