diff --git a/src/components/CodeBlock.tsx b/src/components/CodeBlock.tsx
index ae9d21c72..fa6906375 100644
--- a/src/components/CodeBlock.tsx
+++ b/src/components/CodeBlock.tsx
@@ -30,6 +30,7 @@ export const CodeWrapper = styled.div`
 
 type Iprops = React.PropsWithChildren<{
     code: string;
+    wordBreak?: 'normal' | 'break-all' | 'keep-all' | 'break-word';
 }>;
 export const CodeBlock = (props: Iprops) => {
     const [copied, setCopied] = useState<boolean>(false);
@@ -56,7 +57,9 @@ export const CodeBlock = (props: Iprops) => {
         <Wrapper>
             <CodeWrapper>
                 {props.code ? (
-                    <FreeFlowText>{props.code}</FreeFlowText>
+                    <FreeFlowText style={{ wordBreak: props.wordBreak }}>
+                        {props.code}
+                    </FreeFlowText>
                 ) : (
                     <EnteSpinner />
                 )}
diff --git a/src/components/Container.ts b/src/components/Container.ts
index 9ec7b7faa..8b2be4886 100644
--- a/src/components/Container.ts
+++ b/src/components/Container.ts
@@ -62,8 +62,7 @@ export const FlexWrapper = styled.div`
 `;
 
 export const FreeFlowText = styled.div`
-    word-wrap: break-word;
-    overflow-wrap: break-word;
+    word-break: break-word;
     min-width: 30%;
     text-align: left;
 `;