How to style in_place_editor with css
In order to style the in_place_editor output with CSS, you can use the following elements in your stylesheet. These should work with Rails 0.14.2 and up. The scriptaculous ajax functions allow you to override the form class name, but the Rails form helper doesn’t appear to support that option at this time.
This will style the entire in_place_editor form:
.inplaceeditor-form input { }
The text input field:
.inplaceeditor-form input[type=text] { }
(Note that this CSS selector is ignored in Safari and probably IE…)
The textarea input field (if you use a :rows value greater than 1)
.inplaceeditor-form textarea { }
The cancel link:
.inplaceeditor-form a { }
Or, since the cancel link now has a class of ‘editor_cancel’, so you can style it like:
.inplaceeditor-form .editor_cancel { }
The ‘ok’ button:
.inplaceeditor-form .editor_ok_button { }
____________________________________________
More info on in place editing:
http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor