Hi,
I have gone through the documentation which helps in setting the default background color and fonts in editor.
The article says using ContentAreaCssFile property to assign the css file containing body class to change background color.
I did the same but it doesn't work. If I assign the same file using CssFile.Add method, it sets the background color.
But, this takes away all the classes that were in the 'Apply CSS' dropdown tool. I need them.
I'm using Telerik theme from DLL resource by simply assinging 'telerik' name to skin property, and not customizing it.
Here one tutorial says about using ContentAreaCssFile, and other one says about adding external css file.
http://www.telerik.com/DEMOS/ASPNET/prometheus/Editor/Examples/SettingContentAreaDefaults/DefaultCS.aspx
http://www.telerik.com/help/aspnet-ajax/settingeditorbackgroundandcolor.html
What is the right thing to do?
I tried both of them, none works for me. Only using javascript works. But still leaves me with another problem.
Fonts on entire page that holds editor, are smaller than they should be in firefox. It looks good enough in IE.
Thanks,
Chirag
I have gone through the documentation which helps in setting the default background color and fonts in editor.
The article says using ContentAreaCssFile property to assign the css file containing body class to change background color.
I did the same but it doesn't work. If I assign the same file using CssFile.Add method, it sets the background color.
But, this takes away all the classes that were in the 'Apply CSS' dropdown tool. I need them.
I'm using Telerik theme from DLL resource by simply assinging 'telerik' name to skin property, and not customizing it.
Here one tutorial says about using ContentAreaCssFile, and other one says about adding external css file.
http://www.telerik.com/DEMOS/ASPNET/prometheus/Editor/Examples/SettingContentAreaDefaults/DefaultCS.aspx
http://www.telerik.com/help/aspnet-ajax/settingeditorbackgroundandcolor.html
What is the right thing to do?
I tried both of them, none works for me. Only using javascript works. But still leaves me with another problem.
Fonts on entire page that holds editor, are smaller than they should be in firefox. It looks good enough in IE.
Thanks,
Chirag
1 Answer, 1 is accepted
0
Hi Chirag,
Indeed, if you set the CssFiles property, the editor will not pick up the styles from the parent page.
If you want to load the styles from the parent page, then set the ContentAreaCssFile property, but make sure that you set the !important rule after all css properties set in the body tag of the file loaded through this property, e.g.
ContentAreaCssFile = "~/external.css"
external.css
body
{
background-color: white !important;
color: black !important;
font-size: 14px !important
}
If you experience any problems, please open a support ticket, attach a sample working project and explain the problem. I will examine the project and provide a solution right away.
Kind regards,
Rumen
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
Indeed, if you set the CssFiles property, the editor will not pick up the styles from the parent page.
If you want to load the styles from the parent page, then set the ContentAreaCssFile property, but make sure that you set the !important rule after all css properties set in the body tag of the file loaded through this property, e.g.
ContentAreaCssFile = "~/external.css"
external.css
body
{
background-color: white !important;
color: black !important;
font-size: 14px !important
}
If you experience any problems, please open a support ticket, attach a sample working project and explain the problem. I will examine the project and provide a solution right away.
Kind regards,
Rumen
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center