IE 9 appears to be hitting max CSS files limit (32) when I open the Image Manger from the Editor. According to the network trace the Image Manger Dialog loads 35 css files. The result is that Image Manger is partially unstyled (tab styles missing in particular). FF, Chome are fine of course.
I'm using the RadStyleSheetManager but it cannot combine the files because I'm using the CDN. Is the combination of ImageManger, CDN, and IE just not expected to work? Is there some workaround at would allow me to use the CDN?
<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" CdnSettings-TelerikCdn="Enabled" />
Files loaded in iframe when opening the Image Manger dialog:
1 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/FormDecorator.css GET 304
2 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/FormDecorator.Default.css GET 304
3 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Widgets.css GET 304 text/css
4 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Widgets.Default.css GET 304
5 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/FileExplorer.css GET 304
6 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/FileExplorer.Default.css GET 304
7 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Window.css GET 304
8 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Window.Default.css GET 304
9 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Menu.css GET 304
10 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Menu.Default.css GET 304
11 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/ToolBar.css GET 304
12 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/ToolBar.Default.css GET 304
13 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/ToolTip.css GET 304
14 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/ToolTip.Default.css GET 304
15 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Ajax.css GET 304
16 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Ajax.Default.css GET 304
17 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Splitter.css GET 304
18 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Splitter.Default.css GET 304
19 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/TreeView.css GET 304
20 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/TreeView.Default.css GET 304
21 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Grid.css GET 304
22 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Grid.Default.css GET 304
23 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Slider.css GET 304
24 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Slider.Default.css GET 304
25 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/ListView.css GET 304
26 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/ListView.Default.css GET 304
27 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Upload.css GET 304
28 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Upload.Default.css GET 304
29 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Button.css GET 304
30 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Button.Default.css GET 304
31 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/MultiPage.css GET 304
32 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Editor.css GET 304
33 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Editor.Default.css GET 304
34 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/TabStrip.css GET 304
35 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/TabStrip.Default.css GET 304
Edit:
Since this was working in our previous version of telerik (2012.2.724) I compared the CSS files loaded from that version. 2012.2.724 loaded 31 CSS files, so just within the limit for IE. 2013.1.220 has 4 additional files:
13 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/ToolTip.css GET 304
14 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/ToolTip.Default.css GET 304
21 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Grid.css GET 304
22 http://aspnet-skins.telerikstatic.com/ajaxz/2013.1.220/Default/Grid.Default.css GET 304
So my guess is that controls were added to the dialogs which added CSS files, pushing the number too high. Telerik, if this is indeed the case, maybe you could prebundle the CSS files for a dialog into a single file?
5 Answers, 1 is accepted
I am aware of this problem and indeed it is caused by the IE CSS limitation that is fixed in Internet Explorer 10. Since the RadStyleSheetManager could not combine the CSS files loaded through a CDN server your options are to use an external skin or a custom CDN provider and manually copy and paste the contents of some of the CSS files to others so that the files count does not exceed 31.
I also escalated the problem to the attention of our developers and we will consider implementing a client script that will read and combine the stylesheet imported by the CDN server, which should fix the problem.
Kind regards,
Rumen
the Telerik team
Rank 1
Is this issue fixed ? Any Possible Solution ?
Thanks in Advance
I am afraid that still there is not a built-in solution for this problem.
Yet you could use the suggested by my colleague Rumen workaround, i.e. to manually copy the content from the last 5-10 CSS files into the first one. In this way, even if there are more than 31 style sheets request to the server, all needed content will be loaded properly.
Kind regards,
Veselina Raykova
Telerik
Rank 1
Is there any resolution to this yet? I have to use the local CDN because of the caching issue that Telerik has and now I am having issues with the stylesheet limit being hit with older IE browsers.
What is being done about this?
Thanks
Sean
The "31 stylesheets per file" issue is a browser limitation of Internet Explorer that is not directly related to Telerik UI for ASP.NET controls. We had initially an idea about combining the CSS files from the CDN with a script but this may lead us hit the other limitation of IE - "4095 selectors in a CSS file" and that is why this approach may not be feasible. More information on the matter is available in Internet Explorer CSS limits blog post.
Therefore the most reliable solution will be either to externalize the used skin as a custom skin, so that it does not come from WebResources or disable the CDN only for the pages that use RadEditor.
Regards,
Danail Vasilev
Telerik