diff --git a/src/code/colorful.js b/src/code/colorful.js
index 05ef57f..d4f356e 100644
--- a/src/code/colorful.js
+++ b/src/code/colorful.js
@@ -42,7 +42,6 @@ const INLINE = {
 }
 
 function parseJs(code) {
-  // console.log(code)
   return code
     .replace(EXP, (m, pun, str, flag) => {
       str = str.replace(/&/g, '&').replace(/(\\.)/g, '[fn]$1[/fn]')
@@ -61,6 +60,7 @@ function parseJs(code) {
     .replace(STR, (m, pun, str) => {
       str = str
         .replace(/\[(\w+)\](.*?)\[\/\1\]/g, '$2')
+        .replace(/&lt;(\/?)xmp&gt;/g, '<$1xmp>')
         .replace(/&/g, '&amp;')
         .replace(/</g, '&lt;')
         .replace(/>/g, '&gt;')
@@ -89,6 +89,7 @@ function parseJs(code) {
 }
 
 function rebuild(code) {
+  // console.log(code)
   return code
     .replace(/\[(\/?)tag\]/g, (m, s) => (s ? '</i>' : '<i class="r">'))
     .replace(/\[(\/?)attr\]/g, (m, s) => (s ? '</i>' : '<i class="b">'))
diff --git a/src/markd/core.js b/src/markd/core.js
index b9448b7..3f1316a 100644
--- a/src/markd/core.js
+++ b/src/markd/core.js
@@ -214,10 +214,13 @@ class Tool {
           let attr = hideCopy ? ' hide-copy' : ''
 
           if (isCodeBlock) {
-            list.push('</wc-code>')
+            list.push('</xmp></wc-code>')
           } else {
             list.push(
-              tmp.replace(/^```([\w\#\-]*?)$/, `<wc-code lang="$1"${attr}>`)
+              tmp.replace(
+                /^```([\w\#\-]*?)$/,
+                `<wc-code lang="$1"${attr}><xmp>`
+              )
             )
           }
           isCodeBlock = !isCodeBlock
@@ -225,8 +228,7 @@ class Tool {
           var qlink
           if (isCodeBlock) {
             it = it
-              .replace(/</g, '&lt;')
-              .replace(/>/g, '&gt;')
+              .replace(/<(\/?)([a-z][a-z\d\-]*?)([^>]*?)>/g, '&lt;$1$2$3&gt;')
               .replace('\\`\\`\\`', '```')
           } else {
             if (Helper.isTable(tmp) && !isTable) {
@@ -572,6 +574,6 @@ class Tool {
   }
 }
 
-export default function(str, hideCopy) {
+export default function (str, hideCopy) {
   return Tool.init(fixed(str), hideCopy).parse()
 }
diff --git a/src/meditor/index.wc b/src/meditor/index.wc
index 3ade319..0307046 100644
--- a/src/meditor/index.wc
+++ b/src/meditor/index.wc
@@ -69,6 +69,7 @@
   flex: 1;
   display: flex;
   flex-direction: column;
+  width: 100%;
   border: 1px solid var(--color-grey-2);
   border-radius: inherit;
   font-size: 14px;
@@ -77,6 +78,7 @@
 
 .toolbar {
   display: none;
+  width: 100%;
   height: 34px;
   padding: 5px;
   line-height: 24px;
@@ -118,12 +120,14 @@
 .editor-outbox {
   flex: 1;
   display: flex;
+  width: 100%;
   min-height: 300px;
   border-radius: 3px;
 
   .editor,
   .preview {
     flex: 1;
+    flex-shrink: 0;
   }
 
   .editor {