Akila Kumarasamy
Top achievements
Rank 1
Rank 1
Akila Kumarasamy
asked on 20 Apr 2011, 10:18 PM
Hi,
I have a custom style listed in Editor Apply CSS Class dropdown, and it works perfect when i apply styles both in DESIGN and HTML view of the Editor. The only issue is that all our styles are in "Title" case and the Design View of the editor is displaying the styles irrespective of the css class "case sensistive". In short , the DESIGN view is not case sensitive for css class applied for it. This is making a problem when I display in browser because browser is case sensitive for css classes.
Can any one help me to apply "Case sensitive" for the Design view of the editor.
The below class works in editor DESIGN view for both "class = caption" and "class=Caption". But the browser doesn't.
Thanks,
Akila.
I have a custom style listed in Editor Apply CSS Class dropdown, and it works perfect when i apply styles both in DESIGN and HTML view of the Editor. The only issue is that all our styles are in "Title" case and the Design View of the editor is displaying the styles irrespective of the css class "case sensistive". In short , the DESIGN view is not case sensitive for css class applied for it. This is making a problem when I display in browser because browser is case sensitive for css classes.
Can any one help me to apply "Case sensitive" for the Design view of the editor.
The below class works in editor DESIGN view for both "class = caption" and "class=Caption". But the browser doesn't.
.Caption { color: #999999; font-family: Arial; font-size: 9pt; font-style: italic;}Thanks,
Akila.
4 Answers, 1 is accepted
0
Accepted
Hello Akila,
First here what the w3c specification of CSS2 syntax says:
All CSS style sheets are case-insensitive, except for parts that are not under the control of CSS. For example, the case-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification. Note in particular that element names are case-insensitive in HTML, but case-sensitive in XML.
Review the "Characters and case" part of the official w3c documentation: 4 CSS2 syntax and basic data types
Now on the problem:
You can have case sensitive class names when the page is rendered in XHTML complaint mode (for example you have a doc type such as <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">). This is the XML standard. However when the page is in quirks mode case sensitivity off CSS falls under the HTML standard.
In Design mode RadEditor renders the content in quirks mode. There is no DOCTYPE element in the editpr's content area (the IFRAME). Unfortunately currently it is not possible to configure the DOCTYPE of the editor's content area. We are considering in future to give the user functionality of setting this. In mean time there are two workarounds for this problem:
1. Set the RadEditor's ContentAreaMode property to Div. This will make the content area of the controls a DIV element and it will respect the DOCTYPE of the page where the editor is loaded. Review the following online demo: Editor / ContentAreaMode='Div' property
2. RadEditor offers the ability to create and edit full HTML. Review the following online demo: Editor / Full HTML Page Edit . So you can set the editors content to be such as:
Then just before using the content you can strip all the unnecessary parts.
Kind regards,
Stanimir
the Telerik team
First here what the w3c specification of CSS2 syntax says:
All CSS style sheets are case-insensitive, except for parts that are not under the control of CSS. For example, the case-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification. Note in particular that element names are case-insensitive in HTML, but case-sensitive in XML.
Review the "Characters and case" part of the official w3c documentation: 4 CSS2 syntax and basic data types
Now on the problem:
You can have case sensitive class names when the page is rendered in XHTML complaint mode (for example you have a doc type such as <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">). This is the XML standard. However when the page is in quirks mode case sensitivity off CSS falls under the HTML standard.
In Design mode RadEditor renders the content in quirks mode. There is no DOCTYPE element in the editpr's content area (the IFRAME). Unfortunately currently it is not possible to configure the DOCTYPE of the editor's content area. We are considering in future to give the user functionality of setting this. In mean time there are two workarounds for this problem:
1. Set the RadEditor's ContentAreaMode property to Div. This will make the content area of the controls a DIV element and it will respect the DOCTYPE of the page where the editor is loaded. Review the following online demo: Editor / ContentAreaMode='Div' property
2. RadEditor offers the ability to create and edit full HTML. Review the following online demo: Editor / Full HTML Page Edit . So you can set the editors content to be such as:
<telerik:RadEditor ID="RadEditor1" runat="server"> <Content> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> <body> Content here </body> </html> </Content></telerik:RadEditor>Kind regards,
Stanimir
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Akila Kumarasamy
Top achievements
Rank 1
Rank 1
answered on 25 Apr 2011, 04:46 PM
Hi Stanimir,
Thanks for the clear explanation. Both the suggestions were sounding good but these may not work in our scenarios as we dont want the content to inherit all the CSS from the parent page when using <DIV> also we don't want the clients to get confused when looking at the HTML view to display all HTML tags and doctypes. You details explained me that we can apply the doctype to the content area as we have access to source code. I wanted to know is it a easy fix in the source code or would it needs lot of effort / changes?
Thanks,
AKila.
Thanks for the clear explanation. Both the suggestions were sounding good but these may not work in our scenarios as we dont want the content to inherit all the CSS from the parent page when using <DIV> also we don't want the clients to get confused when looking at the HTML view to display all HTML tags and doctypes. You details explained me that we can apply the doctype to the content area as we have access to source code. I wanted to know is it a easy fix in the source code or would it needs lot of effort / changes?
Thanks,
AKila.
0
Accepted
Hi Akila,
There is no easy fix of the problem. How ever you can overwrite the _setContentAreaHtml method of RadEditor. You can check the source code for it. It is in RadEditor.js. Change
to
If you need further help on this matter, you will have to open an official support ticket. In it I wll be able to provide you with the whole code that you need. However I can not give the code in a forum thread.
Greetings,
Stanimir
the Telerik team
There is no easy fix of the problem. How ever you can overwrite the _setContentAreaHtml method of RadEditor. You can check the source code for it. It is in RadEditor.js. Change
oContent = "<head><style></style></head><body" + operaSpecific + ">" + newContent + "</body>";oContent = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"><head><style></style></head><body" + operaSpecific + ">" + newContent + "</body>";If you need further help on this matter, you will have to open an official support ticket. In it I wll be able to provide you with the whole code that you need. However I can not give the code in a forum thread.
Greetings,
Stanimir
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Akila Kumarasamy
Top achievements
Rank 1
Rank 1
answered on 29 Apr 2011, 03:04 PM
Hi Stanimir,
Thank you....I will try that and if not I will create a support ticket later.....
Thanks,
Akila.
Thank you....I will try that and if not I will create a support ticket later.....
Thanks,
Akila.