Resizing the wordpress editor

Instead of resizing the editor, resize the internal representation inside the TinyMCE instance so the content itself never passes the line. This way the editor can eb any width and the content will never be wider than it’s intended to

Start by adding the editor style in functions.php

function my_theme_add_editor_styles() {
    add_editor_style( 'custom-editor-style.css' );
}
add_action( 'init', 'my_theme_add_editor_styles' );

Inside custom-editor-style.css put:

body#tinymce.wp-editor { 
    width:600px;
    margin-left: auto;
    margin-right: auto;
}

This will center the content inside the editable area in a 600px wide column.

Using this method you can style the editable area to look like the front end, making the WYSIWYG editor far more realistic

e.g. my own site:

enter image description here