TinyMCE工具栏中的空白区域

Question

I'm using latest stable release of TinyMCE 4. Initialization code:

tinyMCE.init({
    mode: "textareas",
    plugins: "codesample hr lists preview anchor code visualblocks fullscreen",
    toolbar: ['alignleft aligncenter alignright alignjustify alignnone | styleselect formatselect | bold italic blockquote | link unlink',
        'bullist numlist anchor | image | preview | codesample | visualblocks fullscreen code'
    ],
    menubar: false,
    height: 600,
    codesample_languages: [
        {text: 'Java', value: 'java'},
        {text: 'Python', value: 'python'},
        {text: 'HTML/XML', value: 'markup'},
        {text: 'JavaScript', value: 'javascript'},
        {text: 'CSS', value: 'css'},
        {text: 'C', value: 'c'},
        {text: 'C++', value: 'cpp'}
    ]
});

This code gives the following result:

As you can see, there is an empty space in the first toolbar, but the second one is OK. How to fix this?

Answer 1

I had a similar problem not related to Django. It would seem that the the menu items were picking up the float position of a previous floating element. Wrap your textarea with a style="clear:both;"

 <div style="clear:both;"> <textarea></textarea> </div>