diff --git a/web/app/components/app/configuration/prompt-value-panel/index.tsx b/web/app/components/app/configuration/prompt-value-panel/index.tsx
index b86094556c..e5884bf3fb 100644
--- a/web/app/components/app/configuration/prompt-value-panel/index.tsx
+++ b/web/app/components/app/configuration/prompt-value-panel/index.tsx
@@ -73,7 +73,7 @@ const PromptValuePanel: FC<IPromptValuePanelProps> = ({
           {
             (promptTemplate && promptTemplate?.trim()) ? (
               <div
-                className="max-h-48 overflow-y-auto text-sm text-gray-700"
+                className="max-h-48 overflow-y-auto text-sm text-gray-700 break-all"
                 dangerouslySetInnerHTML={{
                   __html: format(replaceStringWithValuesWithFormat(promptTemplate, promptVariables, inputs)),
                 }}
diff --git a/web/app/components/base/block-input/index.tsx b/web/app/components/base/block-input/index.tsx
index 6722da8ea3..1b9758593f 100644
--- a/web/app/components/base/block-input/index.tsx
+++ b/web/app/components/base/block-input/index.tsx
@@ -63,7 +63,7 @@ const BlockInput: FC<IBlockInputProps> = ({
   }, [isEditing])
 
   const style = classNames({
-    'block px-4 py-1 w-full h-full text-sm text-gray-900 outline-0 border-0': true,
+    'block px-4 py-1 w-full h-full text-sm text-gray-900 outline-0 border-0 break-all': true,
     'block-input--editing': isEditing,
   })