I am following the link https://www.tutorialrepublic.com/codelab.php?topic=faq&file=css-make-two-divs-side-by-side-with-the-same-height.
At initially when page loads I could see the input and output box to 50% ratio. But after the form submitted, my input box get shrink inorder to fit the content of output box. I am using the codemirror textarea in both the div box. In my below source code,setSize(null, 600) i.e. setSize(width, height), If I change the width to fix number like 500, then it vary according to the browser/window screen. Please suggest how to make 50% ratio of input and output box after the form has been submitted.
<div class="flex-container">
<div class="column">
<textarea id="editor" ></textarea>
<script>
var cm = CodeMirror.fromTextArea(document.getElementById('editor'),{mode:"text/x-java",lineNumbers:true})
cm.setSize(null, "600");</script>
</div>
<div class="column bg-alt">
<textarea id="editor2" ></textarea>
<script>
var cm2 = CodeMirror.fromTextArea(document.getElementById('editor2'),{
mode:"text/x-java" });
cm2.setSize(null, "600")
</script>
</div>
Here is mine output after form has submitted: