diff --git a/client/components/codeEditor/codeEditor.jsx b/client/components/codeEditor/codeEditor.jsx
index 0c7740638..b1beea3cb 100644
--- a/client/components/codeEditor/codeEditor.jsx
+++ b/client/components/codeEditor/codeEditor.jsx
@@ -1,3 +1,5 @@
+
+import './codeEditor.less';
 import React, { useEffect, useRef, forwardRef, useImperativeHandle } from "react";
 
 import { EditorState } from "@codemirror/state";
diff --git a/client/components/codeEditor/codeEditor.less b/client/components/codeEditor/codeEditor.less
index be4e8b2f2..2aba0ae72 100644
--- a/client/components/codeEditor/codeEditor.less
+++ b/client/components/codeEditor/codeEditor.less
@@ -18,11 +18,26 @@
 .codeEditor {
 	font-family: monospace;
 	height: 100%;
+	width:100%;
 
 	@media screen and (pointer: coarse) {
 		font-size: 16px;
 	}
 
+	.cm-scroller {
+		width:100%;
+
+	}
+	.cm-content {
+		width:70%;
+
+		.cm-line {
+			word-wrap: break-word;
+    		white-space: pre-wrap;
+    		word-break: normal;
+		}
+	}
+
 	/* Line numbers and gutters */
 	.cm-gutters {
 		background-color: #f0f0f0;