Developed a page with a menu bar that includes drop down menus.
The code in the <body> for the drop down looks like this:
<div class="popupMenu" id="menuICSMenu">
<div class="menuItem" id="menuItemEnforcement" action="someAction('Enforcement')" >Enforcement</div>
<div class="menuItem" id="menuItemEnrolment" action="navigate('enrollment_wait.html')" >Enrolment</div>
<div class="menuItem" id="menuItemTravellerProcessing" action="someAction('Traveller Processing')">Traveller Processing</div>
<div class="menuItem" id="menuItemRiskAssessment" action="someAction('Risk Assessment')" >Risk Assessment</div>
<div class="menuItem" id="menuItemReports" action="someAction('Reports')" >Reports</div>
</div>
Beneath the menu bar, the working part of the page begins. The code looks like this:
<div class="applicationBlock">
Show: <select name="wipFilter">
<option value="wip" selected>Worklist - Supervisor's Subordinates</option>
<option value="bf">Worklist - User</option>
<option value="all">Unassigned Tasks - Supervisor</option>
</select><br><br>
</div>

The problem is that when the drop down/pull down menu is activated, the select is 'seen' to be on top. How can I fix this?