I've run into a problem whereby the calendar will not appear over html elements with overflow:hidden applied to them. This occurs in FireFox and Opera
Here's the code to replicate it:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <style type="text/css"> div.row { background-color: #f7f7f7; margin: 0 0 10px 0; overflow: hidden; padding: 4px 0; zoom: 1; } div.row span { float: left; text-align: left; width: 200px; } div.row .controlGroup { width: 300px; float: left; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div class="row"> <asp:Label ID="Label1" Text="Date" runat="server" /> <div class="controlGroup"> <asp:TextBox ID="DateTextBox" runat="server" /> <ajaxToolkit:CalendarExtender ID="CalendarExtender1" TargetControlID="DateTextBox" runat="server" /> </div> </div> <div class="row"> <asp:Label ID="Label2" Text="Text" runat="server" /> <div class="controlGroup"> <asp:TextBox ID="Test6TextBox" runat="server" /> </div> </div> </form></body></html>Bump, can anyone help on this one, i've tried setting the z-index on the ajax calendar to no avail.I've managed to fix this issue in Opera with the following, still doesn't show correctly in FireFox though
.ajax__calendar div
{
z-index: 100;
}
Can anyone help on this one, still can't get the Calendar to display correctly in FireFox
Last bump!
This problem also exists on the AutoCompleteExtender
No comments:
Post a Comment