The following code does not render correctly in IE7 or IE8. It works fine in IE9 and other non IE browsers. It seems that if I remove the images from the menu it will render fine in IE7 or IE8.
Please let me know a solution to get this to work with the images, rtl, and width is 100%.
Thanks
Please let me know a solution to get this to work with the images, rtl, and width is 100%.
Thanks
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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
></
title
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"ScriptManager"
runat
=
"server"
/>
<
telerik:RadMenu
ID
=
"RadMenu1"
runat
=
"server"
EnableRootItemScroll
=
"true"
Width
=
"100%"
dir
=
"rtl"
EnableAutoScroll
=
"true"
>
<
Items
>
<
telerik:RadMenuItem
Text
=
"Home"
ImageUrl
=
"/images/icons/102.gif"
/>
<
telerik:RadMenuItem
Text
=
"Task List"
ImageUrl
=
"/images/icons/102.gif"
/>
<
telerik:RadMenuItem
Text
=
"IT Admin"
ImageUrl
=
"/images/icons/102.gif"
/>
<
telerik:RadMenuItem
Text
=
"Content List"
/>
<
telerik:RadMenuItem
Text
=
"My Knowledge Views"
/>
<
telerik:RadMenuItem
Text
=
"Start Process"
ImageUrl
=
"/images/icons/102.gif"
/>
<
telerik:RadMenuItem
Text
=
"Running Workflows"
/>
</
Items
>
</
telerik:RadMenu
>
</
form
>
</
body
>
</
html
>
7 Answers, 1 is accepted
0

Princy
Top achievements
Rank 2
answered on 09 Jul 2012, 04:57 AM
Hi Jay O'Brien,
Try overriding the default CSS as follows.
CSS:
Hope this helps.
Thanks,
Princy.
Try overriding the default CSS as follows.
CSS:
<style type=
"text/css"
>
.RadMenu_Default_rtl .rmText
{
position
:
fixed
!important
;
}
</style>
Hope this helps.
Thanks,
Princy.
0

Gary
Top achievements
Rank 1
answered on 09 Jul 2012, 03:11 PM
Unfortunately that makes the menu items disappear. See screenshot. Any other solutions? Telerik?
0

Princy
Top achievements
Rank 2
answered on 10 Jul 2012, 04:59 AM
Hello,
Try the following code snippet to achieve your scenario.
CSS:
ASPX:
Attached is the screenshot.
Thanks,
Princy.
Try the following code snippet to achieve your scenario.
CSS:
<style type=
"text/css"
>
.RadMenu_Default_rtl .rmItem
{
position
:
relative
!important
;
}
</style>
ASPX:
<
telerik:RadMenu
ID
=
"RadMenu1"
runat
=
"server"
EnableRootItemScroll
=
"true"
Width
=
"100%"
dir
=
"rtl"
EnableAutoScroll
=
"true"
>
<
Items
>
<
telerik:RadMenuItem
Text
=
"Home"
ImageUrl
=
"../Images/bullet5.jpg"
/>
<
telerik:RadMenuItem
Text
=
"Task List"
ImageUrl
=
"../Images/bullet5.jpg"
/>
<
telerik:RadMenuItem
Text
=
"IT Admin"
ImageUrl
=
"../Images/bullet5.jpg"
/>
<
telerik:RadMenuItem
Text
=
"Content List"
/>
<
telerik:RadMenuItem
Text
=
"My Knowledge Views"
/>
<
telerik:RadMenuItem
Text
=
"Start Process"
ImageUrl
=
"../Images/bullet5.jpg"
/>
<
telerik:RadMenuItem
Text
=
"Running Workflows"
/>
</
Items
>
</
telerik:RadMenu
>
Attached is the screenshot.
Thanks,
Princy.
0

Gary
Top achievements
Rank 1
answered on 10 Jul 2012, 03:29 PM
Princy thanks for your help on this. Unfortunately that still has not resolved the issue. Not sure if you are running in the IE 7 document mode but that is where I am seeing the issue. It looks great in IE 9 document mode. Attached is a screenshot in IE 7 document mode.
0
Hello, Jay.
I am not 100% sure why and what was wrong, but I was able to fix it quite easily:
1) I moved the styles for the width from the menu, to a css snippet
2) I tweaked the snippet a bit no to be using floats.
See the attached file.
All the best,
Ivan Zhekov
the Telerik team
I am not 100% sure why and what was wrong, but I was able to fix it quite easily:
1) I moved the styles for the width from the menu, to a css snippet
2) I tweaked the snippet a bit no to be using floats.
See the attached file.
All the best,
Ivan Zhekov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0

Jay
Top achievements
Rank 1
answered on 12 Jul 2012, 02:58 PM
Ivan,
Thanks for the reply. Unfortunately the scrolling does not work now. If you shrink the window and refresh you will notice the menu items go to a second line. I need to have the scrolling available.
Thanks
Thanks for the reply. Unfortunately the scrolling does not work now. If you shrink the window and refresh you will notice the menu items go to a second line. I need to have the scrolling available.
Thanks
0
Hello, Jay.
For scrolling to work you need to set width e.g. width 100%; and then you need to tweak the styles a bit.
I have updated the example and attached it.
Regards,
Ivan Zhekov
the Telerik team
For scrolling to work you need to set width e.g. width 100%; and then you need to tweak the styles a bit.
I have updated the example and attached it.
Regards,
Ivan Zhekov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.