[Solved] IE7 Height Problem

[NMA]

Hi,

The code below is used for location selection purposes on an aspx page. There are 4 RadMenus inside a table which is inside a panel. Only one of these menus are visible at a time. All of these contents are updated inside an RadAjaxPanel.

Everything works fine in Firefox. But in IE7, the height of Menus are out of control!!! I mean, I add the menuitems dynamically at server side. Although I limit the outer panel's height to 400px, if the contents are crowded, it causes an overflow in IE7. 

What can be the cause of this problem?

Thanks...

<asp:Panel ID="pnlContents" Direction="LeftToRight" ScrollBars="Vertical" runat="server"
                                                            Height="400px" Width="330px">
                                                            <table cellpadding="0" cellspacing="0" style="border: solid 1px #828282; background-color: #e5e5e5;
                                                                height: 400px; min-height: 400px; width: 302px;">
                                                                <tr>
                                                                    <td valign="top">
                                                                        <telerik:RadMenu runat="server" ID="rmLevel1" EnableEmbeddedSkins="true" ClickToOpen="true"
                                                                            Flow="vertical" Width="300px" Skin="Default" OnItemClick="rm_ItemClick" Style="z-index: 10 !important;">
                                                                            <Items>
                                                                                <telerik:RadMenuItem Text="U.S. Locations" Width="300px">
                                                                                </telerik:RadMenuItem>
                                                                                <telerik:RadMenuItem Text="International Locations" Width="300px">
                                                                                </telerik:RadMenuItem>
                                                                            </Items>
                                                                        </telerik:RadMenu>
                                                                        <telerik:RadMenu Visible="false" runat="server" EnableEmbeddedSkins="true" ID="rmLevel2"
                                                                            Style="z-index: 10 !important;" ClickToOpen="true" Flow="vertical" Width="300px"
                                                                            Skin="Default" OnItemClick="rm_ItemClick">
                                                                        </telerik:RadMenu>
                                                                        <telerik:RadMenu Visible="false" runat="server" ID="rmLevel3" EnableEmbeddedSkins="true"
                                                                            Style="z-index: 10 !important;" ClickToOpen="true" Flow="vertical" Width="300px"
                                                                            Skin="Default" OnItemClick="rm_ItemClick">
                                                                        </telerik:RadMenu>
                                                                        <telerik:RadMenu Visible="false" runat="server" ID="rmLevel4" EnableEmbeddedSkins="true"
                                                                            Style="z-index: 10 !important;" ClickToOpen="true" Flow="vertical" Width="300px"
                                                                            Skin="Default" OnItemClick="rm_ItemClick">
                                                                        </telerik:RadMenu>
                                                                    </td>
                                                                </tr>
                                                            </table>
                                                        </asp:Panel>

[Yana]

Hi NMA,

Please add the following css styles to your page in order to fix this issue in IE:

<style type="text/css">
    .RadMenu,
    .RadMenu .rmRootGroup,
    .RadMenu .rmRootGroup .rmItem {
        position: static !important;
    }
</style>

Regards,
Yana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[NMA]

Thanks for your suggestion Yana ;)

Meanwhile, we have come up with another solution for this by observing your IPhone-like example for RadMenu thoroughly. ;)