How to set the width of textarea using tinymce?

Question

I tried a several methods to set the width of the tinymce textarea.

My 1st attempt:

height: '200px',
width: '220px'   // inside tinyMCE.init({

In the 2nd attempt:

<textarea name="editorial" cols="40" rows="20" id="editorial" style="width: 40em; height: 20em"><?=$row['editorial']?></textarea>

But still, I am not able to get the width as per my requirement.

Any ideas please?

Answer 1

I think the problem may be with the toolbars in your TinyMCE init function.

Try this example, and let me know if it works for you?

in your HTML:

<textarea name="editorial" class="test" cols="40" rows="20" id="editorial" > editorial</textarea>

then use this tinyMCE.init in your JavaScript:

    tinyMCE.init({
        // General options
        mode: "textareas",
        theme: "advanced",
        width: "300",
        height: "200",

        // Theme options
        theme_advanced_buttons1: "bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull",
        theme_advanced_buttons2: "",
        theme_advanced_buttons3: "",
        theme_advanced_buttons4: "",
        theme_advanced_toolbar_location: "top",
        theme_advanced_toolbar_align: "left",
        theme_advanced_resizing: false,

    // Selector
        editor_selector: "test",

});

Does this work for you?