.scriptingBox-outerDiv { width: 100%; height: 100%; display: flex; flex-direction: column; background-color: rgb(241, 239, 235); padding: 10px; .scriptingBox-inputDiv { display: flex; flex-direction: column; height: calc(100% - 30px); table-layout: fixed; overflow-y: hidden; white-space: nowrap; .scriptingBox-wrapper { width: 100%; height: 100%; max-height: calc(100%-30px); display: flex; flex-direction: row; justify-content: center; overflow-y: scroll; .scriptingBox-textArea { flex: 70; width: 70%; height: 100%; box-sizing: border-box; resize: none; padding: 7px; overflow-y: scroll; } .scriptingBox-plist { flex: 30; width: 30%; height: 100%; box-sizing: border-box; resize: none; padding: 2px; overflow-y: scroll; } .scriptingBox-paramNames { flex: 60; width: 60%; box-sizing: border-box; resize: none; padding: 7px; overflow-y: scroll; } .scriptingBox-paramInputs { flex: 40; width: 40%; box-sizing: border-box; resize: none; padding: 2px; overflow-y: scroll; } } .scriptingBox-errorMessage { overflow: auto; background: "red"; background-color: "red"; height: 40px; } .scripting-params { background: "beige"; } } .scriptingBox-toolbar { width: 100%; height: 30px; .scriptingBox-button { width: 50%; resize: auto; } } }