[whatwg] Proposal: content-style attribute for contenteditable elements

Markus Ernst derernst at gmx.ch
Tue May 17 01:09:16 PDT 2011


While discussing about contenteditable elements, the WYSIWYG aspect was 
mentioned. For real WYSIWYG in a text editor of a CMS, Blog, Forum or 
whatever, it would be necessary for the contents of the contenteditable 
element to:
- Disable the styles of the surrounding page
- Enable the styles of the target page

This could be solved with a @content-style attribute which takes a URL 
pointing to an external stylesheet document. If the attribute is 
present, all styles of the surrounding page are ignored, and the styles 
of the linked CSS document are applied to the content of the element.

Special cases:
- If the linked CSS document contains declarations for the body element, 
they are applied to the contenteditable element itself. (This could be 
necessary in case of light text on dark backgrounds, where you want to 
apply the background to the contenteditable area.)
- If there are conflicts between body element styles in the linked 
stylesheet and the styles of the contenteditable element in the 
surrounding page, the latter win. (This is necessary to keep the 
dimensions of the input UI, if an author links the whole CSS of the 
target page.)

- In today's iframe-based online rich text editors, it is common to 
apply the styles of the target page of the edited text to the source 
document of the iframe. This is not possible in a <div contenteditable>.
- For many use cases, such as forum and blog entries, or non-fullpage 
oriented web content management systems, <div contenteditable> is easier 
to implement than iframe-based editors. The only downside is the WYSIWYG 

I'd be happy to read some comments on this idea!

More information about the whatwg mailing list