It seems in many cases the best option for an editor input field is to have the width set by the browser, and as the window is expanded the editor also expands.

Normally this is done with the CSS element width=100%, but with rich:editor there appears to be problems:

1) rich:editor attributes width (and height) must be an integer, and they are always treated as pixels, so "width='100%'" generates an exception.

2) Even worse, it does not appear to be possible to change the width using CSS because the width that needs to be targeted has an explicit "style" attribute that sets width, so any CSS is eclipsed. The generated source for the component (without any width specified in the rich:editor) is:

<table class="mceLayout" cellspacing="0" cellpadding="0" style="width: 162px; height: 500px;">

so a style that correctly selects this element (i.e. table.mceLayout) is unable to override the explicit width.

Is there some other way to achieve the desired layout? If not, adding a "widthIsPercent" attribute to rich:editor would be a simple way to achieve it.