diff --git a/lib/templates/components/content/elements/CeDefault.js b/lib/templates/components/content/elements/CeDefault.js
index 078544d1..8ae86981 100644
--- a/lib/templates/components/content/elements/CeDefault.js
+++ b/lib/templates/components/content/elements/CeDefault.js
@@ -2,15 +2,25 @@ export default {
   functional: true,
   render(createElement, ctx) {
     return createElement(
-      'code',
+      'pre',
       {
         style: {
-          display: 'block',
-          maxWidth: '100%',
-          wordBreak: 'break-word'
+          overflowX: 'scroll'
         }
       },
-      JSON.stringify(ctx.props)
+      [
+        createElement(
+          'code',
+          {
+            style: {
+              fontSize: '12px',
+              fontFamily:
+                'SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace'
+            }
+          },
+          [JSON.stringify(ctx.props, null, 2)]
+        )
+      ]
     )
   }
 }