Controlling Z-order of (date input-boxes)?

Question

I have several <cfinput> controls placed vertically (using an HTML table).  They are "date" fields with the nice drop-down calendar.
Trouble is ... when the calendar drops down, it drops down behind the calendar-control below it.  This obscures the month-name bar and almost prevents access to the previous/next month buttons.
I was therefore wondering:  is it easily and conveniently possible to control the z-order of the drop down calendar, so that it appears in front of everything?
(P.S.  As usual, "it works fine in FireFox, and breaks in IE."  No surprise there...)

Answer 1

This work-around should fix the problem (though its annoying that we even need a work-around for this):
<table cellpadding="6" cellspacing="0" border="0">
<tr>
  <td><b>Date 1</b></td>
  <td>
  <div style="clear:both;position:relative;z-index:3;">
     <cfinput name="Date1" id="Date1" type="DateField" value="" mask="M/D/YYYY" validate="USDate" required="yes" message="Please enter Date 1.">
  </div>
  </td>
  </tr>
  <tr>
  <td><b>Date 2</b></td>
  <td>
  <div style="clear:both;position:relative;z-index:2;">
    <cfinput name="Date2" id="Date2" type="DateField" value="" mask="M/D/YYYY" validate="USDate" required="yes" message="Please enter Date 2." >
  </div>
  </td>
  </tr>
  <tr>
  <td><b>Date 3</b></td>
  <td>
  <div style="clear:both;position:relative;z-index:1;">
    <cfinput name="Date3" id="Date3" type="DateField" value="" mask="M/D/YYYY" validate="USDate" required="yes" message="Please enter Date 3." >
  </div>
  </td>
  </tr>
</table>