tinymce

http://stackoverflow.com/questions/12991548/how-to-make-tinymce-responsive

by joshfeck

HTML

<script src="http://tinymce.moxiecode.com//js/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<form method="post" action="somepage">
    <textarea class="tinyMCE" name="content"></textarea>
</form>

<p class="note-mobile">...now showing the mobile version</p>
<p class="note-desktop">...now showing the desktop version</p>

CSS

table.mceLayout, textarea.tinyMCE {
    width: 100% !important;
}

.note-desktop {
    display: none;
}

/* make the toolbar wrap */
.mceToolbar td {
	display:table-row;
	float: left;
}
.mceToolbar td:nth-of-type(11){
	clear: left;
}

@media only screen and (min-width: 600px) {
    table.mceLayout, textarea.richEditor {
       width: 600px !important;
    }
    
    .note-desktop {
        display: block;
    }
    .note-mobile {
        display: none;
    }
    
    /* remove the toolbar wrap */
    .mceToolbar td {
	    display:table-cell;
	    float: none;
    }
    mceToolbar td:nth-of-type(11){
	    clear: none;
    }
}

JavaScript

tinyMCE.init({
    mode : "specific_textareas",
	editor_selector: "tinyMCE",
    theme : "advanced",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
	theme_advanced_resizing : "true",
	theme_advanced_resize_horizontal : "true",
    theme_advanced_buttons1 : 
      "formatselect, bold, italic, underline, separator, " + 
	  "justifyleft, justifycenter, justifyright, indent, outdent, separator, " + 
	  "bullist, numlist, separator, link, unlink, separator, undo, redo,image",
	theme_advanced_buttons2 : "",
	theme_advanced_buttons3 : ""
});