RTL Problem in RADMenu

7 posts, 0 answers
  1. hoty rah
    hoty rah avatar
    2 posts
    Member since:
    Oct 2009

    Posted 31 Oct 2009 Link to this post

    Dears,

    I use radmenu in rtl mode.
    when i move the mouse to a extensible menuitem , menu  jump to left completely in IE but it is ok in firefox.

    Thanks,
    Hoty
  3. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 05 Nov 2009 Link to this post

    Hello hoty rah,

    The online demo is working fine. What could be different in your case?

    Sincerely yours,
    Veselin Vasilev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  5. Derrick
    Derrick avatar
    3 posts
    Member since:
    Jun 2006

    Posted 05 Nov 2009 Link to this post

    I saw the exact same problem after upgrading to the latest version.  I had to downgrade to solve the problem.

    In my testing, the problem only affected IE 8.  It rendered correctly (the same as before) in the latest version of Firefox and in IE 7.

    Derrick Brundage
  7. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 05 Nov 2009 Link to this post

    Hi,

    This issue is caused by the iframe overlay that is rendered under the submenus in order to overlay flash elements for instance. The triggered IE bug is weird and currently we couldn't find a way to fix it directly. Until we can, one workaround is to switch off the menu overlay if you don't use it, another workaround is to move the direction (dir="rtl") attribute from the body tag to the form tag.

    Let me know if this works for you.

    Sincerely yours,
    Kamen Bundev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  9. hoty rah
    hoty rah avatar
    2 posts
    Member since:
    Oct 2009

    Posted 07 Nov 2009 Link to this post

    Dear Kamen Bundev,

    I switch off the menu overlay 'EnableOverlay="false"' and it's ok now.

    Thanks in advance,
    Hoty
  11. Sara
    Sara avatar
    1 posts
    Member since:
    Aug 2012

    Posted 27 Aug 2012 Link to this post

    I Cant Resolve this problem,Help me please ..
    My menu jump to right in IE 7, but it work correctly in IE9 & IE 8

    /* RadMenu Default skin */
     
    .RadMenu_Green
    {
        border: 0px solid #010101;
        border-bottom-width: 0;
        border-top-color: #839BB3;
        background: #839BB3 url() repeat-x top left;
        text-align: left;
         
     
         
    }
     
     
    .RadMenu_Green_rtl
    {
        text-align: right;
         
         
    }
     
    .RadMenu_Green_Context
    {
        background: none;
        border: 0;
    }
     
    .RadMenu_Green a
    {
        text-decoration: none;
    }
     
    .RadMenu_Green .rmLink
    {
         
        text-decoration: none;
        color: #fff;
    }
     
    .RadMenu_Green .rmLink:focus,
    .RadMenu_Green .rmFocused
    {
        outline: 20;
    }
     
    .RadMenu_Green .rmExpanded
    {
        position: relative;
        z-index: 10000;
    }
     
    .RadMenu_Green .rmLink:hover, .RadMenu_Green .rmFocused, .RadMenu_Green .rmExpanded
    {
        /*FirstMenu_Background*/
        background-color: #A4b5c5;
        color: #333;
         
         
    }
     
    .RadMenu_Green .rmLink .rmText
    {
        font: normal 12px Arial, sans-serif;
        color: #FFFFFF;
        font-family: tahoma;
        min-width:180px;
    }
     
    .RadMenu_Green .rmGroup
    {
        background: #fff;
    }
     
    .RadMenu_Green .rmGroup .rmLink
    {
        /* text-decoration: none;
        color: #333;*/
        /* copy from another css*/
        border-style: solid;
        border-width: 0px 0;
        border-top-color: #f6f7f9;
        border-bottom-color: #dde1e4;
        width: auto;
        text-align: left;
        color: #333;
        min-width: 130px;
        font-weight: normal;
    }
     
    .RadMenu_Green_rtl .rmGroup .rmLink
    {
        text-align: right;
    }
     
    .RadMenu_Green .rmGroup .rmLink:hover,
    .RadMenu_Green .rmGroup .rmFocused,
    .RadMenu_Green .rmGroup .rmExpanded
    {
        color: red;
        /*SubMenu_backGround*/
        background: #839BB3;
    }
     
    .RadMenu_Green .rmText
    {
        padding: 3px 20px 5px;
    }
     
    .RadMenu_Green .rmGroup .rmLink .rmText
    {
        font-size: 11px;
        padding: 4px 37px 5px 20px;
    }
     
    .RadMenu_Green_rtl .rmGroup .rmLink .rmText
    {
        padding: 4px 20px 5px 37px;
    }
     
    /* <expand arrows styling> */
     
    .RadMenu_Green .rmGroup .rmLink .rmExpandRight
    {
        background: transparent url(Menu/ArrowExpand.gif) no-repeat right -1px;
         
    }
     
    .RadMenu_Green .rmGroup .rmLink .rmExpandLeft
    {
        background: transparent url(Menu/ArrowExpandRTL.gif) no-repeat left -1px;
    }
     
    .RadMenu_Green .rmGroup .rmLink:hover .rmExpandRight,
    .RadMenu_Green .rmGroup .rmFocused .rmExpandRight,
    .RadMenu_Green .rmGroup .rmExpanded .rmExpandRight
    {
        background-image: url(Menu/ArrowExpandHovered.gif);
    }
     
    .RadMenu_Green .rmGroup .rmLink:hover .rmExpandLeft,
    .RadMenu_Green .rmGroup .rmFocused .rmExpandLeft,
    .RadMenu_Green .rmGroup .rmExpanded .rmExpandLeft
    {
        background-image: url(Menu/ArrowExpandHoveredRTL.gif);
    }
     
    /* </expand arrows styling> */
     
    .RadMenu_Green .rmHorizontal .rmItem { border-right: 0px solid #353535; padding-bottom:1px; }
    .RadMenu_Green .rmHorizontal .rmLast { border-right: 0; }
    /* hr top Menu*/
    .RadMenu_Green .rmVertical .rmItem { border-bottom: 0px solid #353535; }
    .RadMenu_Green .rmVertical .rmLast { border-bottom: 0; padding-bottom: 1px; }
     
    .RadMenu_Green_rtl .rmHorizontal .rmItem { border-left: 0; }
     
    .RadMenu_Green .rmRootGroup .rmGroup .rmItem,
    .RadMenu_Green_Context .rmGroup .rmItem
    { border-right: 0; border-bottom: 0; padding-bottom: 0; }
     
    .RadMenu_Green .rmGroup
    {
        /*subMenu border*/
        border: 1px solid #828282;
        /*subMenu background*/
        background-color: #A4B5C5;
    }
     
    .RadMenu_Green .rmGroup .rmExpanded
    {
        z-index: 1;
    }
     
    .RadMenu_Green .rmTopArrow,
    .RadMenu_Green .rmBottomArrow
    {
        height: 10px;
        width: 100%;
        background: #fff url(Menu/ArrowScrollUpDown.gif) no-repeat top center;
    }
     
    .RadMenu_Green .rmBottomArrow
    {
        background-position: center -18px;
    }
     
    .RadMenu_Green .rmLeftArrow,
    .RadMenu_Green .rmRightArrow
    {
        width: 10px;
        height: 100%;
        background: #fff url(Menu/ArrowScrollLeftRight.gif) no-repeat left center;
    }
     
    .RadMenu_Green .rmRightArrow
    {
        background-position: -18px center;
    }
     
    .RadMenu_Green .rmItem .rmDisabled .rmText
    {
        color: #999;
    }
     
    .RadMenu_Green .rmRootGroup .rmItem .rmDisabled
    {
        background: none;
    }
     
    .RadMenu_Green .rmGroup .rmItem .rmDisabled
    {
        background-color: #fff;
    }
     
    .RadMenu_Green .rmRootGroup .rmSeparator,
    .RadMenu_Green .rmGroup .rmSeparator
    {
        background: #FF9632;
        border-top: 0px solid #676767;
        border-bottom: 0;
    }
     
    .RadMenu_Green .rmSeparator .rmText
    {
        display: none;
    }
     
    .RadMenu_Green .rmHorizontal .rmSeparator
    {
        height: 20px;
        width: 1px;
        line-height: 20px;
        border: 0;
    }
     
    .RadMenu_Green .rmVertical .rmSeparator
    {
        height: 1px;
        margin: 3px 0;
        border: 0;
        line-height: 1px;
    }
     
    .RadMenu_Green .rmLeftImage
    {
        margin: 2px;
    }
     
    .RadMenu_Green .rmSlide
    {
        margin: -1px 0 0 -1px !important;
    }
     
    .RadMenu_Green .rmHorizontal .rmSlide
    {
        margin-top: -2px !important;
    }
     
    .RadMenu_Green_rtl .rmSlide
    {
        margin-left: 0 !important;
        margin-right: -1px !important;
    }
     
    .RadMenu_Green .rmGroup .rmSlide
    {
        margin: 0 !important;
    }
     
    .RadMenu_Green .rmItem .rmDisabled:hover
    {
        background: none;
    }
  13. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    651 posts

    Posted 27 Aug 2012 Link to this post

    Hello, Sara.

    This thread is almost three years old. Any information provided here might be out of date or otherwise not relevant.

    Please start a new support thread and include your page / part of project there. If you are not sure how to isolate a runnable page / portion of your project, you can refer to this article -- http://blogs.telerik.com/supportdept/posts/10-09-29/isolating-a-problem-in-a-sample-project.aspx -- it's a bit old, but still relevant.

    In a nut shell, a simple page that exhibits the issue should do; make sure you include not only the page, but the code file as well; also all relevant assets such as images, scripts, styles etc should be included in the archive, as well as anything else you thing is relevant to your case.

    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.
Back to Top