Question

If TinyMCE is in jQuery ui-tabs, it will only properly size if in the 1st tab (or the tab selected to be open when ui-tabs is created). On every other tab, TinyMCE will only have a couple of lines and will only be as long as the toolbars.

I haven’t been able to figure out any way to solve this.

On the jsFiddle demo below, run it and you’ll see only the TinyMCE editor on tab 1 is sized properly. Then —

CHANGE:

$('#tabs').tabs('select', 0);

TO:

$('#tabs').tabs('select', 1);

And, run again. You’ll see that since the 2nd tab is now open by default, only the TinyMCE window on that tab is sized properly.

jsFiddle demo

Thanks for any help!

Answer 1

The only way I’ve found to solve this, is to initialize the tabs after the initialization of tinymce, by adding:

oninit : function(){
    $("#tabs").tabs();
},

to the initialization options of tinymce.

It’s not particularly elegant, because the user briefly sees the page in it’s pre-tabbed state, but it does work and I was unable to find a way to make tinymce dynamically resize.