diff --git a/src/public/app/widgets/type_widgets/abstract_text_type_widget.js b/src/public/app/widgets/type_widgets/abstract_text_type_widget.js
index 93cb1b27d..e78687356 100644
--- a/src/public/app/widgets/type_widgets/abstract_text_type_widget.js
+++ b/src/public/app/widgets/type_widgets/abstract_text_type_widget.js
@@ -4,8 +4,15 @@ import froca from "../../services/froca.js";
 import linkService from "../../services/link.js";
 import contentRenderer from "../../services/content_renderer.js";
 import utils from "../../services/utils.js";
+import options from "../../services/options.js";
 
 export default class AbstractTextTypeWidget extends TypeWidget {
+
+    doRender() {
+        super.doRender();
+        this.refreshCodeBlockOptions();
+    }
+
     setupImageOpening(singleClickOpens) {
         this.$widget.on("dblclick", "img", e => this.openImageInCurrentTab($(e.target)));
 
@@ -108,4 +115,16 @@ export default class AbstractTextTypeWidget extends TypeWidget {
             });
         }
     }
+
+    refreshCodeBlockOptions() {
+        const wordWrap = options.is("codeBlockWordWrap");
+        this.$widget.toggleClass("word-wrap", wordWrap);
+    }
+
+    async entitiesReloadedEvent({loadResults}) {
+        if (loadResults.isOptionReloaded("codeBlockWordWrap")) {
+            this.refreshCodeBlockOptions();            
+        }
+    }
+
 }
diff --git a/src/public/stylesheets/style.css b/src/public/stylesheets/style.css
index 60e375216..d3252c211 100644
--- a/src/public/stylesheets/style.css
+++ b/src/public/stylesheets/style.css
@@ -811,6 +811,17 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
     border: 0;
     border-radius: 6px;
     box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
+    padding: 0 !important;
+}
+
+.ck-content pre code {
+    display: block;
+    padding: 1em;
+}
+
+.note-detail-printable:not(.word-wrap) pre {
+    white-space: pre;
+    margin-right: 1em;
 }
 
 .ck-content .todo-list .todo-list__label > input:before {