Increase Rich Text Editor’s Field Width in SharePoint site

There are times when you would like that the rich text editor on your SharePoint site fits the entire page width so that you can edit the content easily. By default, the editor field is around 400 pixels in width and does not increase beyond it. It is due to the CSS style applied on that SharePoint field control.

I wanted something like this on my site:

This is how you achieve it:
https://zsharepoint.wordpress.com/2013/05/15/sharepoint-101-full-width-rich-text-editor/

Thanks to Zach. This was a very simple CSS hack to modify the width of the rich text editor.

1. Create a new .css file and enter the following code over there:

#onetIDListForm, #onetIDListForm .ms-formbody, #onetIDListForm 
iframe[title="Rich Text Editor"]{width:100% !important;} 
.ms-formbody span span div iframe, .ms-formbody span span 
table.ms-long{width:100%; text-align:left;} 

2. Save the .css file in a document library on your site.
3. Reference the .css file in the masterpage using the following code.

NOTE: There is some problem with blogger, not allowing me to post the entire code. Please refer to the link mentioned above for the code to reference your CSS file in your masterpage. 4. Save the changes to MasterPage and refresh the page.

Or you can check out my another blog - http://sharepointservices.wordpress.com/2011/03/09/increase-rich-text-editors-field-width-in-sharepoint-site