Hi,
I just encountered a bug with the Kendo Menu with IE7. If you align your menu to the right of the page, and for some reason you don't have enough place to display the entire sub-menu, the menu won't display correctly or at all.
In the screen shot kendo-menu-ff.png we have the display i got in firefox.
In he screen shot kendo-menu.png we have the display in IE7.
With the IE Developper Tool bar I manage to see that the plugin creates two nested div to contain the animation. The first one, have the overflow property set to hidden and the second one, the nested one, was move to accommodate the lack of space to display it entirely. Hence the result shown earlier. (you can see it by your self with the two other screenshots kendo-menu- 2.pgn and kendo-menu- 3.png).
Since the pluggin write those property directly at the element level, I can't correct it with CSS.
I'm using the kendo-all.js.
Here's my code to generate the menu but I doubt it's my implementation that is at cause. (Without Razor )
And here how I initialise the menu :
Please, tell me how to fix this.
I just encountered a bug with the Kendo Menu with IE7. If you align your menu to the right of the page, and for some reason you don't have enough place to display the entire sub-menu, the menu won't display correctly or at all.
In the screen shot kendo-menu-ff.png we have the display i got in firefox.
In he screen shot kendo-menu.png we have the display in IE7.
With the IE Developper Tool bar I manage to see that the plugin creates two nested div to contain the animation. The first one, have the overflow property set to hidden and the second one, the nested one, was move to accommodate the lack of space to display it entirely. Hence the result shown earlier. (you can see it by your self with the two other screenshots kendo-menu- 2.pgn and kendo-menu- 3.png).
Since the pluggin write those property directly at the element level, I can't correct it with CSS.
I'm using the kendo-all.js.
Here's my code to generate the menu but I doubt it's my implementation that is at cause. (Without Razor )
<
ul
id
=
"kendoMenu"
>
<
li
><
a
href
=
"/"
>Thèmes</
a
>
<
ul
>
<
li
<a
href
=
"/Rapports/HEB_QUE"
>Hébergement au Québec 1</
a
></
li
>
<
li
><
a
href
=
"/Rapports/ENT_FRO"
>Entrées à la frontière</
a
></
li
>
</
ul
>
</
li
>
<
li
>domirich
<
ul
>
<
li
><
a
href
=
"/Account/LogOff"
>Déconnexion</
a
></
li
>
</
ul
>
</
li
>
<
li
>Pilotage
<
ul
>
<
li
><
a
href
=
"/Pilotage/Autorisations"
>Gestion des autorisations</
a
></
li
>
<
li
><
a
href
=
"/Pilotage/Sources"
>Gestion des sources</
a
></
li
>
<
li
><
a
href
=
"/Pilotage/Concepts"
>Gestion des thèmes</
a
></
li
>
</
ul
>
</
li
>
</
ul
>
And here how I initialise the menu :
<
script
type
=
"text/javascript"
>
$(document).ready(function () {
$("#kendoMenu").kendoMenu(
{
direction: "bottom"
});
});
</
script
>
Please, tell me how to fix this.