Change height for only one textarea using ckeditor

Question

I get 3 ckeditor textareas in one page. The problem is that I want one of the textarea to be the same size than twice the others. I can't find how to resize ONLY ONE textarea.

<script type="text/javascript">
        CKEDITOR.config.height='600px';
</script>

Works fine but it changes all the textareas. I also tried

<script type="text/javascript">            
     CKEDITOR.replace('Resolution',{
                height  : '400px',
   });
</script>

But this doesn't work... I tried to change my config.js file but still nothing. If i put in my config.js

CKEDITOR.editorConfig = function( config ) {

        config.width = '1000px';
        config.height = '700px'; 
};

It doesn't work.

To summarize: How can i resize a textarea using its ID ??

Answer 1

Used CSS to change height on the editor:

.ck-editor__editable {
  min-height: 200px;
}

Here is one more example (based on CKEditor5):

let theEditor;

ClassicEditor
  .create(document.querySelector('#editor'), {

    toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList', 'blockQuote']
  })
  .then(editor => {
    theEditor = editor;

  })
  .catch(error => {
    console.error(error);
  });


function getDataFromTheEditor() {
  return theEditor.getData();
}

document.getElementById('getdata').addEventListener('click', () => {
  alert(getDataFromTheEditor());
});

.ck-editor__editable {
  min-height: 200px;
}

<script src="https://cdn.ckeditor.com/ckeditor5/10.0.1/classic/ckeditor.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea name="content" id="editor">
<p>Here goes the initial content of the editor.</p>
</textarea>
<button id="getdata">Print data</button>