Menu labels truncated to next line in IE

[Chris]

I have some menus where the last letter of a label is pushed to the next line. It isn't every label, just certain ones on the end. I'm not really quite sure why it is happening or where to begin to fix it. The behavior only shows up in IE (shocker!). I've attached some screen shots so that you can see. Any suggestions would be helpful.

[Kevin]

Hello Chris,

Is there some sort of style that would be conflicting with the one used by the RadMenu when viewing in IE. You can use the IE Developer tool to see if the width is somehow being reduced on those menu items.

[Chris]

I'll look, but it doesn't happen on the other menus. I'm not sure what kind of CSS could do that.

[Chris]

Here is what I have so far. It looks like an embedded base stylesheet to causing problems. In the picture I've attached, notice I've unchecked a check in the IE dev tools allowing another style to take effect. I've tried disabling embedded base styles, but that doesn't seem to have an effect. I've tried overriding the style with a !important directive, but apparently the styles need to cascade in a particular way because it is not working. Any suggestions?

[Chris]

I now have EnableEmbeddedBaseStylesheet and EnableEmbeddedSkins set to false, but according to the resource view in Chrome, the WebResource.axd is still outputting the Telerik.Web.UI.Skins.Menu.css embedded resource. Is there ANY way to stop that?

[Chris]

More progress in this front, so far the only way I am able prevent the base styles from coming down is specifying Telerik.EnableEmbeddedBaseStylesheet in web.config. That one prevents all base styles from coming down. I can't get any of the more specific ones (such as Telerik.Menu.EnableEmbeddedBaseStylesheet) to work.

[Peter]

Hi Chris,

The base stylesheet is required for the proper appearance of the Telerik controls. In your case you can try overriding the problematic css selector by adding the following rule to your page:

.rmText
{
    padding-right: 12px !important;
}

Greetings,
Peter
the Telerik team

[Chris]

I tried that and it doesn't fix the problem. All it does is make the overall width of the menu item less. I'd be able to easily fix this issue if I can just insert the base styles myself. As you can see from this thread, I've tried lots of things to make that happen just for the menu. Any further suggestions?

[Peter]

Hi,

Please, review this help topic. Setting EnableEmbeddedBaseStylesheet="false" should prevent the Web resources from serving these styles, unless you have another instance of RadMenu somewhere else on the page which does not have this setting. Could you please check if this is not the case?


Kind regards,
Peter
the Telerik team