MegaDropdown Menu Example - Css Problem in IE8

[Simon Martin-Lemmon]

Hi,

I am currently implementing a page based on the MegaDropdown menu example, which can be found at

http://demos.telerik.com/aspnet-ajax/menu/examples/megadropdown/defaultcs.aspx

In Firefox, it all looks nice, but in IE8, the little bullets next to the last level menu items dont appear until you hover over the div that is dropped down from the menu.

As well as occuring in my application, I have also downloaded the example file and it showed this problem and it also shows it when using the demo page on the Telerik demos site as shown in the url above.

I am pulling my hair out trying to find what to put into the css file to stop this happening.

Any help would be very much appreciated.

Many thanks in advance.

Simon

[T. Tsonev]

Hi Simon,

Thank you for reporting this problem. Such issues were easily fixed with hasLayout in earlier versions of IE, but this no longer works in IE 8. We have to force it to refresh the elements by using JavaScript:

<script type="text/javascript">

    function itemOpened(s, e)
    {
        if ($telerik.isIE8)
        {
            // Fix an IE 8 bug that causes the list bullets to disappear
            $telerik.$("li", e.get_item().get_element())
                .each(function() { this.style.cssText = this.style.cssText; });
        }
    }

</script>

<telerik:RadMenu runat="server" ID="RadMenu1" OnClientItemOpened="itemOpened"

I hope this helps.

Best wishes,
Tsvetomir Tsonev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Simon Martin-Lemmon]

Hi,

That worked perfectly - thankyou very much.

Simon