<h：selectonemenu>下拉列表在IE11中向上移动

Question

我有一个显示下拉列表。它在IE 11中的表现与其他浏览器不同。

<h:selectOneMenu value="#{eventConfigBean.selectedData.orgId}" id="orgId" 
                    disabled="#{eventConfigBean.selectedData.disableOrgId}" tabindex="1" 
                            style="width:100%;font-size:11;">                                       
                    <f:selectItem itemLabel="" itemValue="" />                                           
                    <c:forEach var="orgIdList" items="#{eventConfigBean.orgIdVOList}">                      
                        <f:selectItem itemLabel="#{orgIdList.value}" itemValue="#{orgIdList.value}" />                      
                    </c:forEach>
                    <a4j:support event="onchange" action="#{eventConfigBean.getEventNames}" reRender="eventName" />
                </h:selectOneMenu>   

我第一次选择项目时工作正常，

但重新选择时，项目列表会向上移动并以所选项目为中心。

Answer 1

我遇到了同样的问题。在codepen中找到了一个解决方法

but it required some extra wrapper div
<div id="box">
 <div id="open"></div>
 <select>
<option>first</option>
<option>second</option>
<option>third</option>
 </select>
  <div id="mark"></div>
<div id="refer"></div>
</div>

https://codepen.io/anon/pen/zvrbeW?editors=0100