jussa
12-10-2007, 05:05 AM
Hey everyone, I am having some troubles with IE 7 and my z-index order. In firefox, the divDefaultActivityCode appears above the textbox controls...
in IE 7, the textbox controls show in the div, including the Activity Name & Department text...its as tho the div doesnt have a back...yet a background color is defined, and when populated (done via ajax), there are alternating row colors for the items inside the divDefaultActivityCode object...
<div class="formItem">
<label for="txtDefaultActivityCode">Activity Code <span class="requiredItem">*</span></label><br />
<input type="text" id="txtDefaultActivityCode" runat="server" style="width:182px;" onkeyup="displayCodes('defaultActivity', this.value, 0, false);" /><img src="images/global/arrow_down.gif" alt="" class="formDropDownArrow" onclick="displayDefaultActivity(document.getElementById('txtDefaultActivityCode').value, true);" /><br />
<div id="divDefaultActivityCode" style="display:none;"></div>
</div>
<div class="formItem">
<label for="txtActivityName">Activity Name <span class="requiredItem">*</span></label><br />
<input type="text" id="txtActivityName" runat="server" style="width:180px" readonly="readonly" />
</div>
<div class="formItem">
<label for="txtDepartment">Department <span class="requiredItem">*</span></label><br />
<input type="text" id="txtDepartment" runat="server" style="width:180px" readonly="readonly" />
</div>
the divDefaultActivityCode is the only element with a z-index defined (as 10), yet controls still show through.
Why is this?
Cheers,
Justin
in IE 7, the textbox controls show in the div, including the Activity Name & Department text...its as tho the div doesnt have a back...yet a background color is defined, and when populated (done via ajax), there are alternating row colors for the items inside the divDefaultActivityCode object...
<div class="formItem">
<label for="txtDefaultActivityCode">Activity Code <span class="requiredItem">*</span></label><br />
<input type="text" id="txtDefaultActivityCode" runat="server" style="width:182px;" onkeyup="displayCodes('defaultActivity', this.value, 0, false);" /><img src="images/global/arrow_down.gif" alt="" class="formDropDownArrow" onclick="displayDefaultActivity(document.getElementById('txtDefaultActivityCode').value, true);" /><br />
<div id="divDefaultActivityCode" style="display:none;"></div>
</div>
<div class="formItem">
<label for="txtActivityName">Activity Name <span class="requiredItem">*</span></label><br />
<input type="text" id="txtActivityName" runat="server" style="width:180px" readonly="readonly" />
</div>
<div class="formItem">
<label for="txtDepartment">Department <span class="requiredItem">*</span></label><br />
<input type="text" id="txtDepartment" runat="server" style="width:180px" readonly="readonly" />
</div>
the divDefaultActivityCode is the only element with a z-index defined (as 10), yet controls still show through.
Why is this?
Cheers,
Justin