p:selectOneMenu dropdown menu display

[afd0174]

Hi,

I am using a p:selectOneMenu component on a page. It's functioning as desired, but what I'm seeing is the dropdown menu being rendered "detached" from the rest of the component, floating below it. Something like:

|---------| // Dropdown select box

// My page's background (i.e. dropdown menu not "growing" from bottom of select box)

---------- // Dropdown menu selection begins here
----------
----------
...

I'm not supplying any of my own style or styleClass parameters:

Code: Select all

<p:selectOneMenu value="#{DashboardBackingBean.selectedTimeScale}">
    <f:selectItem itemLabel="Select One" itemValue="" />
    <f:selectItems value="#{DashboardBackingBean.timeScaleSelectionList}"/>
    <p:ajax listener="#{DashboardBackingBean.timeScaleChanged}" 
                process="@this" update="@form"/>
</p:selectOneMenu>

I've browsed against my page in both FireFox 22 and Safari 7.0.4 with the same floating drop down shown in each browser. I'm running Mojarra 2.1.18 and PrimeFaces 5.0. I've also specified the PrimeFaces theme "Smoothness" in my web.xml file, if that's useful. Thanks in advance for any assistance.

Best regards,

-Andy

[andyba]

How does it look with other Themes?

[afd0174]

I did try another theme (can't recall which one) and the result was the same.

[afd0174]

Just tried the Aristo theme and the result is still the same (i.e. detached, floating drop-down with p:selectOneMenu). Inspected the CSS via Firebug and there isn't anything obvious there (i.e. it appears all of the PrimeFaces css rules are being applied). I wonder what I'm missing?