+1-888-365-2779
Try Now
More in this section

Forums / Designing with Sitefinity / Help With Styling RadMenu

Help With Styling RadMenu

6 posts, 0 answered
  1. Rob
    Rob avatar
    20 posts
    Registered:
    03 Jun 2010
    06 Dec 2010
    Link to this post
    Ok, so here's my situation.  I've been working on styling this RadMenu for the past 5 days, and I'm not doing too well.  For whatever reason the main nav is working fine, but the dropdown part is horrible.  The navigation isn't hovering, the mouse isn't showing the correct hover, and the hover/focused won't stop showing a border-radius, even though I've told it to stop.  I'm at the point now where no matter what I try, nothing changes.

    Can somebody look at my code and tell me what's going on?

    001./* ----- div.mainnav ----- */
    002.div.RadMenu_navMenu {
    003.    width: 960px;
    004.    height: 37px;
    005.    clear: both;
    006.    }
    007. 
    008. 
    009./* ----- div.mainnav ul ---- */
    010.div.RadMenu ul.rmHorizontal {
    011.    margin: 0;
    012.    padding: 0 0 0 15px !important;
    013.    height: 37px;
    014.    list-style: none;
    015.    }
    016. 
    017. 
    018./* ----- div.mainnav li ------- */
    019.div.RadMenu_navMenu li.rmLink {
    020.    float: left;
    021.    }
    022. 
    023. 
    024./* ----- div.mainnav li ------- */
    025./* ----- div.mainnav span ----- */
    026.div.RadMenu_navMenu li.rmLink,
    027.div.RadMenu_navMenu .rmTemplate span.rmText {
    028.    padding: 0 !important;
    029.    font: normal .85em Verdana, Arial, Helvetica, sans-serif;
    030.    text-decoration: none;
    031.    }
    032. 
    033.div.RadMenu_navMenu ul.rmHorizontal li.rmLink span.rmText {
    034.    padding: 10px 12px 9px 12px;
    035.    color: #FFF;
    036.    }
    037.     
    038.div.RadMenu_navMenu ul.rmHorizontal a.rmLink span.rmText:hover {
    039.    color: #000;
    040.    background: #FFF;
    041.    cursor: auto;
    042.    border-top: 1px solid #303135;
    043.    border-right: 1px solid #303135;
    044.    border-left: 1px solid #303135;
    045.    border-radius: 8px 8px 0 0;
    046.    -webkit-border-radius: 8px 8px 0 0;
    047.    -moz-border-radius: 8px 8px 0 0;
    048.    -khtml-border-radius: 8px 8px 0 0;
    049.    }
    050. 
    051./* ----- div.mainnav span:hover ----- */
    052./* ----- div.mainnav li:hover ------- */
    053.div.RadMenu_navMenu .rmText:hover,
    054.div.RadMenu_navMenu .rmLink:hover {
    055.    display: block;
    056.    cursor: auto;
    057.    }
    058. 
    059. 
    060. 
    061./* ----- div.mainnav a:focused --------- */
    062./* ----- div.mainnav a (when open) ----- */
    063.div.RadMenu_navMenu ul.rmHorizontal a.rmFocused { /* main nav heading current state */
    064.    color: #000;
    065.    background: #A4D045;
    066.    text-decoration: none;
    067.    }
    068.     
    069..RadMenu_navMenu .rmExpanded {
    070.    color: #000;
    071.    background: #A4D045;
    072.    text-decoration: none
    073.    }
    074. 
    075..RadMenu_navMenu .rmFocused:hover {border: none;}
    076. 
    077. 
    078./* ----- div.mainnav span ----- */
    079..RadMenu_navMenu .rmText {/* main nav headings */
    080.    margin: 0;
    081.    display: block;
    082.    text-decoration: none;
    083.    text-transform:uppercase;
    084.    }
    085. 
    086. 
    087. 
    088./* ----- div.mainnav li ul -----*/
    089..RadMenu_navMenu .rmGroup { /* drop down style bg & border */
    090.    /*width: 296px;
    091.    height: 173px;*/
    092.    position: absolute;
    093.    background: #FDFDFD url(images/bg_dropdown.jpg) left bottom repeat-x ;
    094.    border-bottom: 1px solid #014A90;
    095.    border-right: 1px solid #014A90;
    096.    border-left: 1px solid #014A90;
    097.    }
    098. 
    099. 
    100. 
    101./* ----- div ul li ul ----- */
    102..RadMenu .rmRootGroup .rmItem .rmGroup {margin: 0;}
    103. 
    104. 
    105. 
    106./* ----- div li ul span -----*/
    107..RadMenu .rmGroup .rmText {
    108.    margin: 0 !important;
    109.    padding: 1px 0 1px 0 !important;
    110.    color: #888787;
    111.    }
    112. 
    113..rmLink:hover {
    114.    cursor: auto;
    115.    }
    116. 
    117. 
    118./* ----- div.mainnav li ul span ----- */
    119..RadMenu_navMenu .rmGroup .rmText {
    120.    font-size: 11px;
    121.    color: #000;
    122.    }
    123. 
    124..RadMenu_navMenu .rmGroup .rmTemplate .rmText {}
    125. 
    126./* ----- div.mainnav li ul a  ------- */
    127./* ----- div.mainnav li ul span ----- */
    128..RadMenu_navMenu .rmGroup .rmLink,
    129..RadMenu_navMenu .rmGroup .rmTemplate .rmText { /* drop down normal state */
    130.     padding: 5px 0 5px 10px !important;
    131.     width: 286px;
    132.     display: block;
    133.     background: url(images/bg_dropdownseperator.jpg) bottom no-repeat;
    134.     text-decoration: none;
    135.     text-transform: capitalize;
    136.     }
    137. 
    138. 
    139. 
    140..RadMenu .rmVertical .rmLink, .RadMenu .rmHorizontal .rmVertical .rmLink .rmText {
    141.    color: #888787;}
    142.     
    143..RadMenu .rmVertical .rmLink:hover,
    144..RadMenu .rmHorizontal .rmVertical .rmLink .rmText:hover {
    145.    color: #206DB5;
    146.    background: #FFF;} 
    147. 
    148.     
    149..RadMenu .rmVertical .rmLink .rmFocused
    150..RadMenu .rmHorizontal .rmVertical .rmLink .rmFocused {
    151.    color: #206DB5;
    152.    background: #FFF;
    153.    border: none !important;}  
    154. 
    155. 
    156./* ----- div.mainnav li ul span:hover --------- */
    157./* ----- div.mainnav li ul a:hover ------------ */
    158./* ----- div.mainnav li ul a:focused ---------- */
    159./* ----- div.mainnav li ul a (when open) ------ */
    160..RadMenu_navMenu .rmGroup .rmTemplate .rmText:hover, 
    161..RadMenu_navMenu .rmGroup .rmLink:hover,
    162..RadMenu_navMenu .rmGroup .rmFocused,
    163..RadMenu_navMenu .rmGroup .rmExpanded { /* drop down hover state */
    164.    color: #163D71;
    165.    background: #FFF;
    166.    }
    167. 
    168. 
    169. 
    170./* ----- div.mainnav li ul li:hover ----- */
    171./* ----- div.mainnav li ul span:hover ----- */
    172..RadMenu_navMenu .rmGroup .rmItem:hover,
    173..RadMenu_navMenu .rmGroup .rmText:hover {
    174.    color: #163D71;
    175.    display:block;
    176.    }
    177. 
    178. 
    179..RadMenu .rmVertical .rmLink .rmFocused, .RadMenu .rmHorizontal .rmVertical .rmFocused
    180./*.RadMenu_navMenu .rmGroup .rmItem .rmFocused*/ {
    181.    background: #FFF;
    182.    border: none !important;
    183.    border-left: none;
    184.    }

    Thanks!
    Rob
  2. Rob
    Rob avatar
    20 posts
    Registered:
    03 Jun 2010
    06 Dec 2010
    Link to this post
    Ok, so scratch that last bit of code.  Somehow I copied the wrong code.  Below is what I'm actually using, and what it's not doing is hovering correctly.  It's actually not showing any hovering at all.  =\

    001./* ----- div.mainnav ----- */
    002..RadMenu_navMenu {width: 960px; height: 37px; clear: both;}
    003. 
    004. 
    005. 
    006./* ----- div.mainnav ul ---- */
    007..RadMenu ul.rmHorizontal {margin: 0; padding: 0 0 0 15px !important; height: 37px; list-style: none;}
    008. 
    009. 
    010. 
    011./* ----- div.mainnav span (plus the direction you want it expand to should you have special classes for links with dropdowns) -----*/
    012./*.RadMenu_navMenu .rmExpandTop {background: url(/images/icon_dropdownarrow.png) right 20px no-repeat;}
    013..RadMenu_navMenu .rmExpandRight {background: url(/images/arrow.png) 90% 50% no-repeat;}
    014..RadMenu_navMenu .rmExpandDown {background: url(/images/icon_dropdownarrow.png) right 10px no-repeat;}
    015..RadMenu_navMenu .rmExpandLeft {background: url(/images/arrow.png) 90% 50% no-repeat;}*/
    016. 
    017. 
    018. 
    019./* ----- div.mainnav li ------- */
    020..RadMenu_navMenu .rmLink {float: left;}
    021./*.RadMenu .rmLink {padding: 12px 8px 7px 12px !important; text-decoration: none;}
    022..RadMenu .rmLink:hover,
    023..RadMenu .rmLink:active {background: #FFF; color: #000;}*/
    024. 
    025. 
    026. 
    027./* ----- div.mainnav li ------- */
    028./* ----- div.mainnav span ----- */
    029..RadMenu_navMenu .rmLink,
    030..RadMenu_navMenu .rmTemplate .rmText {
    031.    /*margin: 0; display: block;*/
    032.    /*padding: 12px 8px 7px 12px !important;*/
    033.    padding: 0 !important;
    034.    font: normal .85em Verdana, Arial, Helvetica, sans-serif;
    035.    text-decoration: none;}
    036. 
    037..RadMenu_navMenu .rmHorizontal .rmLink .rmText {
    038.    padding: 10px 12px 9px 12px; color: #FFF;}
    039..RadMenu_navMenu .rmHorizontal .rmLink .rmText:hover {
    040.    color: #000;
    041.    background: #FFF;
    042.    cursor: auto;
    043.    border-top: 1px solid #303135;
    044.    border-right: 1px solid #303135;
    045.    border-left: 1px solid #303135;
    046.    border-radius: 8px 8px 0 0;
    047.    -webkit-border-radius: 8px 8px 0 0;
    048.    -moz-border-radius: 8px 8px 0 0;
    049.    -khtml-border-radius: 8px 8px 0 0;
    050.    }
    051. 
    052./* ----- div.mainnav span:hover ----- */
    053./* ----- div.mainnav li:hover ------- */
    054..RadMenu_navMenu .rmTemplate .rmText:hover,
    055..RadMenu_navMenu .rmLink:hover {/*display: block;*/}
    056. 
    057. 
    058. 
    059./* ----- div.mainnav a:focused --------- */
    060./* ----- div.mainnav a (when open) ----- */
    061..RadMenu_navMenu .rmHorizontal .rmFocused { /* main nav heading current state */
    062.    color: #000;
    063.    background: #A4D045;
    064.    border-top: 1px solid #303135;
    065.    border-right: 1px solid #303135;
    066.    border-left: 1px solid #303135;
    067.    border-radius: 8px 8px 0 0;
    068.    -webkit-border-radius: 8px 8px 0 0;
    069.    -moz-border-radius: 8px 8px 0 0;
    070.    -khtml-border-radius: 8px 8px 0 0;
    071.    text-decoration: none;
    072.    }
    073.     
    074..RadMenu_navMenu .rmExpanded {
    075.    color: #000;
    076.    background: #A4D045;
    077.    border-radius: 8px 8px 0 0;
    078.    -webkit-border-radius: 8px 8px 0 0;
    079.    -moz-border-radius: 8px 8px 0 0;
    080.    -khtml-border-radius: 8px 8px 0 0
    081.    text-decoration: none
    082.}
    083. 
    084..RadMenu_navMenu .rmFocused:hover {border: none;}
    085. 
    086./*.rmItem .rmClicked, .rmitem .rmFocused, .rmFocused:hover,
    087..rmItem .rmExpanded,
    088..rmItem .rmClicked:hover,
    089..rmItem .rmExpanded:hover {color: #000000 !important; background:#FFF;}
    090.     
    091.     
    092..rmText:hover, .rmExpandDown {color:#000 !important; background: #FFF; }*/
    093. 
    094./* ----- div.mainnav span ----- */
    095..RadMenu_navMenu .rmText {  /* main nav headings */
    096.    margin: 0;
    097.    display: block;
    098.    text-decoration: none;
    099.    text-transform:uppercase;
    100.    color: #000;
    101.    /*font: normal .85em Verdana, Arial, Helvetica, sans-serif;*/
    102.    }
    103. 
    104. 
    105. 
    106./* ----- div.mainnav li ul -----*/
    107..RadMenu_navMenu .rmGroup { /* drop down style bg & border */
    108.    /*width: 296px;
    109.    height: 173px;*/
    110.    position: absolute;
    111.    background: #FDFDFD url(images/bg_dropdown.jpg) left bottom repeat-x ;
    112.    border-bottom: 1px solid #014A90;
    113.    border-right: 1px solid #014A90;
    114.    border-left: 1px solid #014A90;
    115.    }
    116. 
    117. 
    118. 
    119./* ----- div ul li ul ----- */
    120..RadMenu .rmRootGroup .rmItem .rmGroup {margin: 0;}
    121. 
    122. 
    123. 
    124./* ----- div li ul span -----*/
    125..RadMenu .rmGroup .rmText {
    126.    margin: 0 !important; padding: 1px 0 1px 0 !important; color: #888787;
    127.    }
    128. 
    129..rmLink:hover {cursor: crosshair;}
    130. 
    131. 
    132./* ----- div.mainnav li ul span ----- */
    133..RadMenu_navMenu .rmGroup .rmText {
    134.    font-size: 11px; color: #000;
    135.    }
    136. 
    137..RadMenu_navMenu .rmGroup .rmTemplate .rmText {}
    138. 
    139./* ----- div.mainnav li ul a  ------- */
    140./* ----- div.mainnav li ul span ----- */
    141..RadMenu_navMenu .rmGroup .rmLink,
    142..RadMenu_navMenu .rmGroup .rmTemplate .rmText { /* drop down normal state */
    143.     text-transform: capitalize; width: 286px; display: block; background: url(images/bg_dropdownseperator.jpg) bottom no-repeat;
    144.     text-decoration: none; padding: 5px 0 5px 10px !important;}
    145. 
    146. 
    147. 
    148..RadMenu .rmVertical .rmLink, .RadMenu .rmHorizontal .rmVertical .rmLink .rmText {
    149.    color: #888787;}
    150.     
    151..RadMenu .rmVertical .rmLink:hover,
    152..RadMenu .rmHorizontal .rmVertical .rmLink .rmText:hover {
    153.    color: #206DB5;
    154.    background: #FFF;} 
    155. 
    156.     
    157..RadMenu .rmVertical .rmLink .rmFocused
    158..RadMenu .rmHorizontal .rmVertical .rmLink .rmFocused {
    159.    color: #206DB5;
    160.    background: #FFF;
    161.    border: none !important;}  
    162. 
    163. 
    164./* ----- div.mainnav li ul span:hover --------- */
    165./* ----- div.mainnav li ul a:hover ------------ */
    166./* ----- div.mainnav li ul a:focused ---------- */
    167./* ----- div.mainnav li ul a (when open) ------ */
    168..RadMenu_navMenu .rmGroup .rmTemplate .rmText:hover, 
    169..RadMenu_navMenu .rmGroup .rmLink:hover,
    170..RadMenu_navMenu .rmGroup .rmFocused,
    171..RadMenu_navMenu .rmGroup .rmExpanded { /* drop down hover state */
    172.    color: #163D71; background: #FFF;
    173.    }
    174. 
    175. 
    176. 
    177./* ----- div.mainnav li ul li:hover ----- */
    178./* ----- div.mainnav li ul span:hover ----- */
    179..RadMenu_navMenu .rmGroup .rmItem:hover,
    180..RadMenu_navMenu .rmGroup .rmText:hover {
    181.    color: #163D71; display:block;
    182.    }
    183. 
    184. 
    185..RadMenu .rmVertical .rmLink .rmFocused, .RadMenu .rmHorizontal .rmVertical .rmFocused
    186./*.RadMenu_navMenu .rmGroup .rmItem .rmFocused*/ {background: #FFF; border: none !important; border-left: none; border-right: none; border-top: none;}
  3. Rob
    Rob avatar
    20 posts
    Registered:
    03 Jun 2010
    06 Dec 2010
    Link to this post
    Ok, I've done a little more work.  I got the top nav to work correctly, and the dropdown nav to work correctly (but only in Firefox slightly).  In Firefox, Opera, and IE 7-9, it displays the hover effects, but not in Chrome or Safari.  Across all browsers, it's not showing the hand icon for the mouse.  It's showing whatever it feels like.  Below is the last bit of code.

    001./* ----- div.mainnav ----- */
    002..RadMenu_navMenu {
    003.    width: 960px;
    004.    height: 37px;
    005.    clear: both;
    006.    }
    007. 
    008. 
    009. 
    010./* ----- div.mainnav ul ---- */
    011..RadMenu ul.rmHorizontal {
    012.    margin: 0;
    013.    padding: 0 0 0 15px !important;
    014.    height: 37px;
    015.    list-style: none;
    016.    }
    017.     
    018. 
    019. 
    020./* ----- div.mainnav li ------- */
    021..RadMenu_navMenu .rmLink {float: left;}
    022. 
    023. 
    024. 
    025./* ----- div.mainnav li ------- */
    026./* ----- div.mainnav span ----- */
    027..RadMenu_navMenu .rmLink,
    028..RadMenu_navMenu .rmTemplate .rmText {
    029.    padding: 0 !important;
    030.    font: normal .85em Verdana, Arial, Helvetica, sans-serif;
    031.    text-decoration: none;}
    032. 
    033. 
    034.div.RadMenu_navMenu ul.rmHorizontal a.rmLink span.rmText {
    035.    padding: 10px 12px 9px 12px;
    036.    color: #FFF;
    037.    }
    038.     
    039..RadMenu_navMenu .rmHorizontal .rmLink .rmText:hover {
    040.    color: #000;
    041.    background: #FFF;
    042.    cursor: auto;
    043.    border-top: 1px solid #303135;
    044.    border-right: 1px solid #303135;
    045.    border-left: 1px solid #303135;
    046.    border-radius: 8px 8px 0 0;
    047.    -webkit-border-radius: 8px 8px 0 0;
    048.    -moz-border-radius: 8px 8px 0 0;
    049.    -khtml-border-radius: 8px 8px 0 0;
    050.    }
    051. 
    052./* ----- div.mainnav span:hover ----- */
    053./* ----- div.mainnav li:hover ------- */
    054..RadMenu_navMenu .rmTemplate .rmText:hover,
    055..RadMenu_navMenu .rmLink:hover {/*display: block;*/}
    056. 
    057. 
    058. 
    059./* ----- div.mainnav a:focused --------- */
    060./* ----- div.mainnav a (when open) ----- */
    061..RadMenu_navMenu .rmHorizontal .rmFocused { /* main nav heading current state */
    062.    color: #000;
    063.    background: #A4D045;
    064.    border-top: 1px solid #303135;
    065.    border-right: 1px solid #303135;
    066.    border-left: 1px solid #303135;
    067.    border-radius: 8px 8px 0 0;
    068.    -webkit-border-radius: 8px 8px 0 0;
    069.    -moz-border-radius: 8px 8px 0 0;
    070.    -khtml-border-radius: 8px 8px 0 0;
    071.    text-decoration: none;
    072.    }
    073.     
    074..RadMenu_navMenu .rmExpanded {
    075.    color: #000;
    076.    background: #A4D045;
    077.    border-radius: 8px 8px 0 0;
    078.    -webkit-border-radius: 8px 8px 0 0;
    079.    -moz-border-radius: 8px 8px 0 0;
    080.    -khtml-border-radius: 8px 8px 0 0
    081.    text-decoration: none
    082.}
    083. 
    084..RadMenu_navMenu .rmFocused:hover {
    085.    border: none;
    086.    }
    087. 
    088. 
    089./* ----- div.mainnav span ----- */
    090..RadMenu_navMenu .rmText {  /* main nav headings */
    091.    margin: 0;
    092.    display: block;
    093.    text-decoration: none;
    094.    text-transform:uppercase;
    095.    color: #000;
    096.    }
    097. 
    098. 
    099. 
    100./* ----- div.mainnav li ul -----*/
    101..RadMenu_navMenu .rmGroup { /* drop down style bg & border */
    102.    position: absolute;
    103.    background: #FDFDFD url(images/bg_dropdown.jpg) left bottom repeat-x ;
    104.    border-bottom: 1px solid #014A90;
    105.    border-right: 1px solid #014A90;
    106.    border-left: 1px solid #014A90;
    107.    }
    108. 
    109. 
    110. 
    111./* ----- div ul li ul ----- */
    112..RadMenu .rmRootGroup .rmItem .rmGroup {margin: 0;}
    113. 
    114. 
    115. 
    116./* ----- div li ul span -----*/
    117..RadMenu .rmGroup .rmText {
    118.    margin: 0 !important;
    119.    padding: 1px 0 1px 0 !important;
    120.    color: #888787;
    121.    }
    122. 
    123..rmLink:hover {cursor: crosshair;}
    124. 
    125. 
    126./* ----- div.mainnav li ul span ----- */
    127..RadMenu_navMenu .rmGroup .rmText {
    128.    font-size: 11px;
    129.    color: #000;
    130.    }
    131. 
    132..RadMenu_navMenu .rmGroup .rmTemplate .rmText {}
    133. 
    134./* ----- div.mainnav li ul a  ------- */
    135./* ----- div.mainnav li ul span ----- */
    136..RadMenu_navMenu .rmGroup .rmLink,
    137..RadMenu_navMenu .rmGroup .rmTemplate .rmText { /* drop down normal state */
    138.     padding: 5px 0 5px 10px !important;
    139.     width: 286px;
    140.     display: block;
    141.     background: url(images/bg_dropdownseperator.jpg) bottom no-repeat;
    142.     text-decoration: none;
    143.     text-transform: capitalize;
    144.     }
    145. 
    146. 
    147. 
    148..RadMenu .rmVertical .rmLink, .RadMenu .rmHorizontal .rmVertical .rmLink .rmText {
    149.    color: #888787;}
    150.     
    151..RadMenu .rmVertical .rmLink:hover,
    152..RadMenu .rmHorizontal .rmVertical .rmLink .rmText:hover {
    153.    color: #206DB5;
    154.    background: #FFF;} 
    155. 
    156. 
    157. 
    158. 
    159..RadMenu_navMenu .rmVertical .rmLink .rmText:hover {
    160.    -moz-border-radius: 0 0 0 0;
    161.    -webkit-border-radius: 0 0 0 0;
    162.    -khtml-border-radius: 0 0 0 0;
    163.    border-radius: 0 0 0 0;
    164.    border: none;
    165.    cursor: auto;
    166.    }
    167.     
    168..RadMenu .rmVertical .rmLink .rmFocused
    169..RadMenu .rmHorizontal .rmVertical .rmLink .rmFocused {
    170.    color: #206DB5;
    171.    background: #FFF;
    172.    }  
    173.     
    174. 
    175./* ----- div.mainnav li ul span:hover --------- */
    176./* ----- div.mainnav li ul a:hover ------------ */
    177./* ----- div.mainnav li ul a:focused ---------- */
    178./* ----- div.mainnav li ul a (when open) ------ */
    179..RadMenu_navMenu .rmGroup .rmTemplate .rmText:hover, 
    180..RadMenu_navMenu .rmGroup .rmLink:hover,
    181..RadMenu_navMenu .rmGroup .rmFocused,
    182..RadMenu_navMenu .rmGroup .rmExpanded { /* drop down hover state */
    183.    color: #163D71;
    184.    background: #FFF;
    185.    }
    186. 
    187. 
    188. 
    189./* ----- div.mainnav li ul li:hover ----- */
    190./* ----- div.mainnav li ul span:hover ----- */
    191..RadMenu_navMenu .rmGroup .rmItem:hover,
    192..RadMenu_navMenu .rmGroup .rmText:hover {
    193.    color: #163D71;
    194.    display:block;
    195.    }
    196. 
    197. 
    198..RadMenu .rmVertical .rmLink .rmFocused, .RadMenu .rmHorizontal .rmVertical .rmFocused
    199./*.RadMenu_navMenu .rmGroup .rmItem .rmFocused*/ {
    200.    color: #206DB5;
    201.    background: #FFF;
    202.    border: none;
    203.    border-radius: 0 0 0 0;
    204.    -moz-border-radius: 0 0 0 0;
    205.    -webkit-border-radius: 0 0 0 0;
    206.    -khtml-border-radius: 0 0 0 0;
    207.    }

    Hope somebody can help me out here.
  4. Jordan
    Jordan avatar
    172 posts
    Registered:
    20 Oct 2015
    07 Dec 2010
    Link to this post
    Hello Rob,

    In your CSS rules there are cursor: auto; properties on text:hover, so probably that is the reason of the problem with cursor. Use cursor:pointer instead.

    All the best,
    Dancho
    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
  5. Rob
    Rob avatar
    20 posts
    Registered:
    03 Jun 2010
    07 Dec 2010
    Link to this post
    cursor: default; actually had worse effects than cursor: auto; across multiple browsers.

    But, suppose that was the problem, the fact that Chrome and Safari do not display hover states is a bigger problem.
  6. Jordan
    Jordan avatar
    172 posts
    Registered:
    20 Oct 2015
    07 Dec 2010
    Link to this post
    Hi Rob,

    The problem with the browser discrepancies usually is coming when some of the properties are not defined and the the browser takes its own values. So try to unify the styles (like using reset.css).

    Also you can try to change the selector of the hovered element

    from .RadMenu_navMenu .rmHorizontal .rmLink .rmText:hover
    to .RadMenu_navMenu .rmHorizontal .rmLink:hover .rmText

    Kind regards,
    Dancho
    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
Register for webinar
6 posts, 0 answered