Decrease the line spacing in TinyMCE textarea

Question

I am using TinyMCE to provide a rich text editing text editor. But the line spacing between the lines is too much. I have added a screenshot that shows the line spacing I get on pressing an enter. What can be done about it

Answer 1

You can add custom css to your CSS-editor like this:

tinyMCE.init({
        ...
        editor_css : "/content_css.css"
});

See docs here: http://www.tinymce.com/wiki.php/Configuration:editor_css

You can then set a line-height property to whatever height you wish in that file.

You can also change a setting where you can switch between generating paragraph tags (p) or linebreak tags (br) with something like this:

tinyMCE.init({
        ...
        force_br_newlines : true,
        force_p_newlines : false,
        forced_root_block : '' // Needed for 3.x
});

See the docs here for more info: http://www.tinymce.com/wiki.php/Configuration:force_br_newlines

I think TinyMCE does paragraphs as standard when you hit enter, that is why you get a big margin between your lines. You can also use shift+enter like in Word to get a new line that is a line break instead of paragraph.