Overflow rendering of list items

[Rob]

Hi,

I get the problem shown in the attached image with Window XP and IE7. It works fine otherwise. Can anyone identify the cause? I have put the html of the user control containing the list box below.

Thanks.

<%@ Assembly Name="SIMS.UI.UserControls, Version=1.0.0.0, Culture=neutral, PublicKeyToken=bc6fb793b8a12a45" %>
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MaintainUserPermissions.ascx.cs"
    Inherits="SIMS.UI.UserControls.Security.MaintainUserPermissions" EnableViewState="true" %>
<%@ Register TagPrefix="sims" TagName="DisplayMessageControl" Src="~/_Layouts/SIMSControls/Common/UserControls/DisplayMessageControl.ascx" %>
<%@ Register TagPrefix="sims" TagName="MessagePrompt" Src="~/_Layouts/SIMSControls/Common/UserControls/MessagePromptControl.ascx" %>
<asp:ScriptManagerProxy ID="maintainUserPermissionsScriptManagerProxy" runat="server" />
<div>
    <asp:Panel ID="pnlUserPermissionsContainer" runat="server">
        <asp:UpdatePanel ID="mainUpdatePanel" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:HiddenField ID="hfSiteRoleUserData" runat="server" />
                <asp:HiddenField ID="hfSiteModuleData" runat="server" />
                <asp:HiddenField ID="hfModuleRoleData" runat="server" />
                <asp:Panel ID="pnlMessageControl" runat="server" Visible="false">
                    <sims:DisplayMessageControl ID="dmcMessageControl" runat="server" Visible="false" />
                </asp:Panel>
                <table width="100%">
                    <tr>
                        <td style="width: 25%; vertical-align: top">
                            <asp:Label ID="lblUsers" CssClass="label" Text="Users" runat="server" /><br />
                            <div class="rlbDiv">
                                <telerik:RadListBox Width="100%" ID="rlbUsers" runat="server" CheckBoxes="true" Skin=""
                                    OnClientSelectedIndexChanged="SelectedUserChanged" OnClientItemChecked="UserChecked" />
                            </div>
                        </td>
                        <td style="width: 25%; vertical-align: top">
                            <asp:Label ID="lblAgencies" CssClass="label" Text="Agencies" runat="server" /><br />
                            <div class="rlbDiv">
                                <telerik:RadListBox Width="100%" ID="rlbAgencies" runat="server" CheckBoxes="true"
                                    Skin="" OnClientSelectedIndexChanged="SelectedAgencyChanged" OnClientItemChecked="AgencyChecked" />
                            </div>
                        </td>
                        <td style="width: 25%; vertical-align: top">
                            <asp:Label ID="lblModules" CssClass="label" Text="Modules" runat="server" /><br />
                            <div class="rlbDiv">
                                <telerik:RadListBox Width="100%" ID="rlbModules" runat="server" CheckBoxes="true"
                                    Skin="" OnClientSelectedIndexChanged="SelectedModuleChanged" OnClientItemChecked="ModuleChecked" />
                            </div>
                        </td>
                        <td style="width: 25%; vertical-align: top">
                            <asp:Label ID="lblRoles" CssClass="label" Text="Roles" runat="server" /><br />
                            <div class="rlbDiv">
                                <telerik:RadListBox Width="100%" ID="rlbRoles" runat="server" CheckBoxes="true" Skin=""
                                    OnClientItemChecked="RoleChecked" />
                            </div>
                        </td>
                    </tr>
                     <tr>
                        <td style="width:25%; vertical-align: top">
                            <table style="width:100%; vertical-align: top">
                                <tr>
                                    <td>
                                        <asp:TextBox ID="txtUserFilter" runat="server" Text="Search..." ForeColor="Gray" onblur="WaterMark(this, event);" onfocus="WaterMark(this, event);" CssClass="rlbTextbox" />
                                    </td>
                                    <td style="width:5%">
                                        <asp:ImageButton ID="btnUserSearch" runat="server" AlternateText="Search..." CommandName="UserSearch" CssClass="button" />
                                    </td>
                                </tr>
                            </table>
                        </td>
                        <td style="width:25%; vertical-align: top">
                            <table style="width:100%; vertical-align: top">
                                <tr>
                                    <td>
                                        <asp:TextBox ID="txtAgencyFilter" runat="server" Text="Search..." ForeColor="Gray" onblur="WaterMark(this, event);" onfocus="WaterMark(this, event);" CssClass="rlbTextbox" />
                                    </td>
                                    <td style="width:5%">
                                        <asp:ImageButton ID="btnAgencySearch" runat="server" AlternateText="Search..." CommandName="AgencySearch" CssClass="button" />
                                    </td>
                                </tr>
                            </table>
                        </td>
                        <td></td>
                        <td></td>
                    </tr>
                </table>
                <table width="100%">
                    <tr>
                        <%--                        <td style="width:50%; vertical-align: top;">
                            <div align="left">
                                <asp:Button ID="btnUserDetails" runat="server" Text="User Details" CommandName="Details" CssClass="button" />
                            </div>
                        </td>--%>
                        <td style="width: 100%; vertical-align: top">
                            <div align="right">
                                <asp:Button ID="btnSave" runat="server" Text="Save" CommandName="Save" CssClass="button" />
                                <asp:Button ID="btnCancel" runat="server" Text="Cancel" CommandName="Cancel" CssClass="button" />
                                <asp:Button ID="btnDummy" runat="server" CssClass="button" Style="display: none" />
                            </div>
                        </td>
                    </tr>
                </table>
                <div style="position: fixed; top: 0px; left: 0px;">
                    <ajax:ModalPopupExtender ID="mpeDeleteConfirmMessagePrompt" runat="server" TargetControlID="btnDummy"
                        PopupControlID="pnlDeleteConfirmMessagePrompt" BackgroundCssClass="modalBackground"
                        BehaviorID="mpeDeleteConfirmMessagePrompt" />
                    <asp:Panel ID="pnlDeleteConfirmMessagePrompt" CssClass="modalPopup" Style="display: none;
                        width: auto" runat="server">
                        <asp:UpdatePanel ID="pnlDeleteMessagePrompt" runat="server" RenderMode="Inline">
                            <ContentTemplate>
                                <sims:MessagePrompt ID="ucDeleteConfirmMessagePrompt" MessageText="Are you sure you wish to remove all roles for this user, agency and module?"
                                    runat="server" PopupControlID="mpeDeleteConfirmMessagePrompt" ActionText="Yes"
                                    ActionCommandName="Yes" CancelText="No" CancelCommandName="No" />
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </asp:Panel>
                    <ajax:ModalPopupExtender ID="mpeAgencyDeleteConfirmMessagePrompt" runat="server"
                        TargetControlID="btnDummy" PopupControlID="pnlAgencyDeleteConfirmMessagePrompt"
                        BackgroundCssClass="modalBackground" BehaviorID="mpeAgencyDeleteConfirmMessagePrompt" />
                    <asp:Panel ID="pnlAgencyDeleteConfirmMessagePrompt" CssClass="modalPopup" Style="display: none;
                        width: auto" runat="server">
                        <asp:UpdatePanel ID="pnlAgencyDeleteMessagePrompt" runat="server" RenderMode="Inline">
                            <ContentTemplate>
                                <sims:MessagePrompt ID="ucAgencyDeleteConfirmMessagePrompt" MessageText="Are you sure you wish to remove all permissions for this user and agency?"
                                    runat="server" PopupControlID="mpeAgencyDeleteConfirmMessagePrompt" ActionText="Yes"
                                    ActionCommandName="Yes" CancelText="No" CancelCommandName="No" />
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </asp:Panel>
                    <ajax:ModalPopupExtender ID="mpeUserDeleteConfirmMessagePrompt" runat="server" TargetControlID="btnDummy"
                        PopupControlID="pnlUserDeleteConfirmMessagePrompt" BackgroundCssClass="modalBackground"
                        BehaviorID="mpeUserDeleteConfirmMessagePrompt" />
                    <asp:Panel ID="pnlUserDeleteConfirmMessagePrompt" CssClass="modalPopup" Style="display: none;
                        width: auto" runat="server">
                        <asp:UpdatePanel ID="pnlUserDeleteMessagePrompt" runat="server" RenderMode="Inline">
                            <ContentTemplate>
                                <sims:MessagePrompt ID="ucUserDeleteConfirmMessagePrompt" MessageText="Are you sure you wish to remove all permissions for this user?"
                                    runat="server" PopupControlID="mpeUserDeleteConfirmMessagePrompt" ActionText="Yes"
                                    ActionCommandName="Yes" CancelText="No" CancelCommandName="No" />
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </asp:Panel>
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>
    </asp:Panel>
</div>

[Genady Sergeev]

Hi Rob,

This is the infamous position:relative bug, which is present in IE6,7,8. Please apply position:relative to all RadListBox containers which have scroll bar. More information can be found here.

Best wishes,
Genady Sergeev
the Telerik team