I have a textarea that i replace to a CKEditor 4.1 instance using the "moono" skin. The problem is that even when i configure the CKEditor instance to be 100% its toolbar increase my width depend on the its buttons amount. From my research i understand that its happen because the in the "moono" skin "editor.css" file there is a "white-space:nowrap;" on all the element and this definition is preventing the ".cke_toolbar" object to go into a new line even if are floating.
Notes:
- The problem exist only if the parent object is a table object and this is why it can increase its width.
-
The default CKEditor width is 100% and when its say to the editor to get the parent pbject width so in my case i do not need to set a width to the editor (or i can set 100%) and it need to get the parent width.
-
For proving that the problem is from the toolbar you can cancel the javascript note lines in the SJFiddle project and see that the editor get the correct width.
-
In my case i can not use a new line on the toolbar because the textarea width is depend on the user.
Are there is a way to fix it using the CKEditor configuration or that i must edit the "editor.css" and remove the "white-space:nowrap;" from the ".cke_toolbar" manually? I do not like to do it manually because i do not like to fix it anytime i upgrate a CKEditor version.
Here is a JSFiddle example:
http://jsfiddle.net/royshoa/9c2Xp/2/