different style with google chrome and IE9

2 posts, 0 answers
  1. Fabio Cirillo
    Fabio Cirillo avatar
    180 posts
    Member since:
    Jan 2010

    Posted 16 Apr 2013 Link to this post

    Hi,
    i wrote this code radmanu:

    <telerik:RadMenu ID="RadMenu1" Runat="server" EnableRoundedCorners="True"
      OnItemClick="RadMenu1_ItemClick"
      EnableShadows="True" Skin="Office2010Silver"
      style="top: 0px; left: 0px" Height="30px" Width="940px">                                                      
         <Items>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana" Font-Size="Small"
             Text="Immagine profilo" Owner="RadMenu1">
         <Items>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana"
             ImageUrl="~/Image/Icone/kuser.png" Owner="" Text="Nuova immagine">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana"
             ImageUrl="~/Image/Icone/delete.png" Owner="" Text="Elimina immagine">
             </telerik:RadMenuItem>
         </Items>
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" IsSeparator="True"
                 Text="Root RadMenuItem13" Owner="RadMenu1">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana" Font-Size="Small"
             Text="Sfondo biglietto">
                 <Items>
                     <telerik:RadMenuItem runat="server" Font-Names="Verdana"
                         ImageUrl="~/Image/Icone/lphoto.png" Owner="" Text="Nuovo sfondo" Value="3"
                         Width="180px">
                     </telerik:RadMenuItem>
                     <telerik:RadMenuItem runat="server" Font-Names="Verdana"
                         ImageUrl="~/Image/Icone/delete.png" Owner="" Text="Elimina sfondo" Value="4"
                         Width="180px">
                     </telerik:RadMenuItem>
                 </Items>
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" IsSeparator="True" Owner="RadMenu1"
             Text="Root RadMenuItem4">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana"
             Font-Size="Small" Text="I miei preferiti" Enabled="False">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" IsSeparator="True"
             Text="Root RadMenuItem13">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana" Font-Size="Small"
             Text="Invita un amico" Owner="RadMenu1">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" IsSeparator="True" Text="Root RadMenuItem6"
             Owner="RadMenu1">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana" Font-Size="Small"
             Text="Modifica password" Owner="RadMenu1">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" IsSeparator="True"
             Text="Root RadMenuItem8">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana" Font-Size="Small"
             Text="Elimina account">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" IsSeparator="True" Owner="RadMenu1"
                 Text="Root RadMenuItem10">
             </telerik:RadMenuItem>
             <telerik:RadMenuItem runat="server" Font-Names="Verdana" Font-Size="Small"
                 Owner="RadMenu1" Text="Esci da Trycontact">
             </telerik:RadMenuItem>
         </Items>
         <ExpandAnimation Type="OutBack" />
     </telerik:RadMenu>

    and this radmenu is located in a Div with css and this code:

    .divmenuprofile
    {
       width:964px;
       height: 35px;
       text-align:center;
       padding-left:23px;
       padding-top:8px;
       border: 1px solid #D5842B;
       background: #cccccc; /* opera */
       background: -webkit-gradient(linear, top, bottom, from(#cccccc), to(#ffffff)); /* chrome e safari4+ */
       background: -webkit-linear-gradient(top, #cccccc, #ffffff); /* Chrome 10+ e safari6 */
       background: -moz-linear-gradient(top#cccccc#ffffff); /* firefox 3.6+ */
       background: linear-gradient(top, #cccccc, #ffffff);
       filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 0,startColorstr='#cccccc', endColorstr='#ffffff'); /*  IE 5.5-7*/
       -ms-filter: 'progid:DXImageTransform.Microsoft.gradient(GradientType = 0,startColorstr='#cccccc', endColorstr='#ffffff')'; /*  IE 8*/
       border-radius: 8px;
       -moz-border-radius: 8px;
       -khtml-border-radius: 8px;
       -webkit-border-radius: 8px;
       behavior: url(/App_Themes/TryCss/PIE.htc);
    }

    i posted two image. One there's radmenu with google chrome and good view and another with IE9 and the style is differente no good, why and and how can I solve the problem?


  2. MasterChiefMasterChef
    MasterChiefMasterChef avatar
    152 posts
    Member since:
    Jan 2013

    Posted 16 Apr 2013 Link to this post

    Hi Fabio,

    The two instances are not different styles, but they display the information in two different ways. Unfortunately, your menu in IE drops down to a second line, extending the box it is contained in. The easiest fix I can think of is to play with the css file. Either shift the container's margin to the left, or you could make the font size smaller in IE. This should be a simple css fix.

    Good luck,
    Master Chief
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top