diff --git a/parser/index.ts b/parser/index.ts
index 0022f0ba..24a05f40 100644
--- a/parser/index.ts
+++ b/parser/index.ts
@@ -160,7 +160,7 @@ function parseTreeToTextAndRanges(tree: StackItem): [string, Range[]] {
 }
 
 function sortRanges(ranges: Range[]) {
-  return ranges.sort((a, b) => a[1] - b[1] || b[2] - a[2] || a[0].localeCompare(b[0]) || 0); // sort by location to properly handle bold+italic
+  return ranges.sort((a, b) => a[1] - b[1] || b[2] - a[2] || 0); // sort by location to properly handle bold+italic
 }
 
 function parseExpensiMarkToRanges(markdown: string): Range[] {
diff --git a/parser/react-native-live-markdown-parser.js b/parser/react-native-live-markdown-parser.js
index 39d9c669..ed6117db 100644
--- a/parser/react-native-live-markdown-parser.js
+++ b/parser/react-native-live-markdown-parser.js
@@ -31,4 +31,4 @@ $2`},{name:"removeStyle",regex:/<style>.*?<\/style>/gi,replacement:""},{name:"st
 `:(a!==""&&(o+=this.formatTextForQuote(r,a,t),a=""),l===s.length-1?o+=`${s[l]}`:o+=`${s[l]}
 `,i&&(i=!G.contains(s[l],"</pre>")));a!==""&&(o+=this.formatTextForQuote(r,a,t))}else o=e;return o},formatTextForQuote(r,e,t){if(e.match(r)){let o=e.split(`
 `).map(a=>a.substr(4).trim()).join(`
-`);return o=o.trim(),t(o)}return e},containsNonPairTag(r){let e=/<([a-z][a-z0-9-]*)\b[^>]*>|<\/([a-z][a-z0-9-]*)\s*>/gi,t=[],o=e.exec(r);for(;o;){let a=o[1],n=o[2];if(a&&a!=="br")t.push(a);else if(n){let i=t.pop();if(n!==i)return!0}o=e.exec(r)}return t.length!==0},extractLinksInMarkdownComment(r){try{let e=this.replace(r,{filterRules:["link"]}),t=new RegExp(`<a href="${bt}" target="_blank" rel="noreferrer noopener">`,"gi"),o=[...e.matchAll(t)];return x.map(o,n=>G.sanitizeURL(n[1]))}catch(e){console.warn("Error parsing url in ExpensiMark.extractLinksInMarkdownComment",{error:e});return}},getRemovedMarkdownLinks(r,e){let t=this.extractLinksInMarkdownComment(r),o=this.extractLinksInMarkdownComment(e);return t===void 0||o===void 0?[]:x.difference(t,o)}};Ba.initializer();function Vp(r){return Ba.replace(r,{shouldKeepRawInput:!0})}function Yp(r){let e=[],t=0;for(;;){let o=r.indexOf("<",t);if(o===-1){t<r.length&&e.push(["TEXT",r.substring(t)]);break}o!==t&&e.push(["TEXT",r.substring(t,o)]);let a=r.indexOf(">",o);if(a===-1)throw new Error('Invalid HTML: no matching ">"');e.push(["HTML",r.substring(o,a+1)]),t=a+1}return e}function Kp(r){let e=[{tag:"<>",children:[]}];if(r.forEach(([t,o])=>{if(t==="TEXT"){let a=x.unescape(o);e[e.length-1].children.push(a)}else if(t==="HTML")if(o.startsWith("</")){let a=e.pop();e[e.length-1].children.push(a)}else e.push({tag:o,children:[]});else throw new Error(`Unknown token type: ${t}`)}),e.length!==1)throw new Error("Invalid HTML: unclosed tags");return e[0]}function Wp(r){let e="";function t(s){typeof s=="string"?e+=s:s.children.forEach(i)}function o(s){a(s,"syntax")}function a(s,l){let c=e.length;t(s);let p=e.length;n.push([l,c,p-c])}let n=[];function i(s){if(typeof s=="string")e+=s;else if(s.tag==="<>")t(s);else if(s.tag==="<strong>")o("*"),a(s,"bold"),o("*");else if(s.tag==="<em>")o("_"),a(s,"italic"),o("_");else if(s.tag==="<del>")o("~"),a(s,"strikethrough"),o("~");else if(s.tag==="<code>")o("`"),a(s,"code"),o("`");else if(s.tag==="<mention-here>")a(s,"mention-here");else if(s.tag==="<mention-user>")a(s,"mention-user");else if(s.tag==="<blockquote>"){o(">"),a(s,"blockquote");let l=n?.[n.length-1];l[1]-=1,l[2]+=1}else if(s.tag==="<h1>")o("# "),a(s,"h1");else if(s.tag.startsWith("<pre")){let l=x.unescape(s.tag.match(/data-code-raw="([^"]*)"/)[1]);o("```"),a(l,"pre"),o("```")}else if(s.tag.startsWith('<a href="')){let l=s.tag.match(/href="([^"]*)"/)[1],c=x.unescape(l),p=s.tag.match(/link-variant="([^"]*)"/)[1]==="labeled",u=s.tag.match(/data-raw-href="([^"]*)"/),f=u?x.unescape(u[1]):c;!p&&s.children.length===1&&typeof s.children[0]=="string"&&(s.children[0]===f||`mailto:${s.children[0]}`===c)?a(s.children[0],"link"):(o("["),t(s),o("]("),a(f,"link"),o(")"))}else throw new Error("Unknown tag: "+s.tag)}return i(r),[e,n]}function zp(r){return r.sort((e,t)=>e[1]-t[1]||t[2]-e[2]||e[0].localeCompare(t[0])||0)}function Jp(r){let e=Vp(r),t=Yp(e),o=Kp(t),[a,n]=Wp(o);return a!==r?[]:zp(n)}globalThis.parseExpensiMarkToRanges=Jp;})();
+`);return o=o.trim(),t(o)}return e},containsNonPairTag(r){let e=/<([a-z][a-z0-9-]*)\b[^>]*>|<\/([a-z][a-z0-9-]*)\s*>/gi,t=[],o=e.exec(r);for(;o;){let a=o[1],n=o[2];if(a&&a!=="br")t.push(a);else if(n){let i=t.pop();if(n!==i)return!0}o=e.exec(r)}return t.length!==0},extractLinksInMarkdownComment(r){try{let e=this.replace(r,{filterRules:["link"]}),t=new RegExp(`<a href="${bt}" target="_blank" rel="noreferrer noopener">`,"gi"),o=[...e.matchAll(t)];return x.map(o,n=>G.sanitizeURL(n[1]))}catch(e){console.warn("Error parsing url in ExpensiMark.extractLinksInMarkdownComment",{error:e});return}},getRemovedMarkdownLinks(r,e){let t=this.extractLinksInMarkdownComment(r),o=this.extractLinksInMarkdownComment(e);return t===void 0||o===void 0?[]:x.difference(t,o)}};Ba.initializer();function Vp(r){return Ba.replace(r,{shouldKeepRawInput:!0})}function Yp(r){let e=[],t=0;for(;;){let o=r.indexOf("<",t);if(o===-1){t<r.length&&e.push(["TEXT",r.substring(t)]);break}o!==t&&e.push(["TEXT",r.substring(t,o)]);let a=r.indexOf(">",o);if(a===-1)throw new Error('Invalid HTML: no matching ">"');e.push(["HTML",r.substring(o,a+1)]),t=a+1}return e}function Kp(r){let e=[{tag:"<>",children:[]}];if(r.forEach(([t,o])=>{if(t==="TEXT"){let a=x.unescape(o);e[e.length-1].children.push(a)}else if(t==="HTML")if(o.startsWith("</")){let a=e.pop();e[e.length-1].children.push(a)}else e.push({tag:o,children:[]});else throw new Error(`Unknown token type: ${t}`)}),e.length!==1)throw new Error("Invalid HTML: unclosed tags");return e[0]}function Wp(r){let e="";function t(s){typeof s=="string"?e+=s:s.children.forEach(i)}function o(s){a(s,"syntax")}function a(s,l){let c=e.length;t(s);let p=e.length;n.push([l,c,p-c])}let n=[];function i(s){if(typeof s=="string")e+=s;else if(s.tag==="<>")t(s);else if(s.tag==="<strong>")o("*"),a(s,"bold"),o("*");else if(s.tag==="<em>")o("_"),a(s,"italic"),o("_");else if(s.tag==="<del>")o("~"),a(s,"strikethrough"),o("~");else if(s.tag==="<code>")o("`"),a(s,"code"),o("`");else if(s.tag==="<mention-here>")a(s,"mention-here");else if(s.tag==="<mention-user>")a(s,"mention-user");else if(s.tag==="<blockquote>"){if(o(">"),a(s,"blockquote"),n.length>0){let l=n[n.length-1];l[1]-=1,l[2]+=1}}else if(s.tag==="<h1>")o("# "),a(s,"h1");else if(s.tag.startsWith("<pre")){let l=x.unescape(s.tag.match(/data-code-raw="([^"]*)"/)[1]);o("```"),a(l,"pre"),o("```")}else if(s.tag.startsWith('<a href="')){let l=s.tag.match(/href="([^"]*)"/)[1],c=x.unescape(l),p=s.tag.match(/link-variant="([^"]*)"/)[1]==="labeled",u=s.tag.match(/data-raw-href="([^"]*)"/),f=u?x.unescape(u[1]):c;!p&&s.children.length===1&&typeof s.children[0]=="string"&&(s.children[0]===f||`mailto:${s.children[0]}`===c)?a(s.children[0],"link"):(o("["),t(s),o("]("),a(f,"link"),o(")"))}else throw new Error("Unknown tag: {node.tag}")}return i(r),[e,n]}function zp(r){return r.sort((e,t)=>e[1]-t[1]||t[2]-e[2]||0)}function Jp(r){let e=Vp(r),t=Yp(e),o=Kp(t),[a,n]=Wp(o);return a!==r?[]:zp(n)}globalThis.parseExpensiMarkToRanges=Jp;})();
diff --git a/src/__tests__/index.test.tsx b/src/__tests__/index.test.tsx
index 7a92ccae..a246fecf 100644
--- a/src/__tests__/index.test.tsx
+++ b/src/__tests__/index.test.tsx
@@ -13,11 +13,11 @@ const toBeParsedAsHTML: MatcherFunction<[expectedHTML: string]> = function (actu
     throw new Error('These must be of type number!');
   }
   let expected = expectedHTML;
-  const [, ranges]: [string, Array<[MarkdownType, number, number]>] = (global as any).parseMarkdownToTextAndRanges(actual);
-  const markdownRanges = ranges.map((range) => {
+  const ranges = global.parseExpensiMarkToRanges(actual);
+  const markdownRanges: MarkdownTypes.MarkdownRange[] = ranges.map((range) => {
     const [type, startIndex, length] = range;
     return {
-      type,
+      type: type as MarkdownType,
       startIndex,
       length,
     };
@@ -73,15 +73,15 @@ test('strikethrough', () => {
 
 describe('mention', () => {
   test('normal', () => {
-    expect('@here Hello!').toBeParsedAsHTML('<span class="mention">@here</span> Hello!');
+    expect('@here Hello!').toBeParsedAsHTML('<span class="mention-here">@here</span> Hello!');
   });
 
   test('with punctation marks', () => {
-    expect('@here!').toBeParsedAsHTML('<span class="mention">@here</span>!');
+    expect('@here!').toBeParsedAsHTML('<span class="mention-here">@here</span>!');
   });
 
   test('at the beginning of a heading', () => {
-    expect('# @here').toBeParsedAsHTML('<span class="syntax"># </span><span class="h1"><span class="mention">@here</span></span>');
+    expect('# @here').toBeParsedAsHTML('<span class="syntax"># </span><span class="mention-here"><span class="h1">@here</span></span>');
   });
 });
 
@@ -95,7 +95,7 @@ describe('mention-user', () => {
   });
 
   test('at the beginning of a heading', () => {
-    expect('# @mail@mail.com').toBeParsedAsHTML('<span class="syntax"># </span><span class="h1"><span class="mention-user">@mail@mail.com</span></span>');
+    expect('# @mail@mail.com').toBeParsedAsHTML('<span class="syntax"># </span><span class="mention-user"><span class="h1">@mail@mail.com</span></span>');
   });
 });
 
@@ -111,7 +111,9 @@ describe('link', () => {
   });
 
   test('link with same label as href', () => {
-    expect('[https://example.com](https://example.com)').toBeParsedAsHTML('<span class="link">[https://example.co</span>m](https://example.com)');
+    expect('[https://example.com](https://example.com)').toBeParsedAsHTML(
+      '<span class="syntax">[</span>https://example.com<span class="syntax">](</span><span class="link">https://example.com</span><span class="syntax">)</span>',
+    );
   });
 
   test('link with query string', () => {
@@ -133,19 +135,27 @@ describe('email', () => {
 
 describe('email with same label as address', () => {
   test('label and address without "mailto:"', () => {
-    expect('[someone@example.com](someone@example.com)').toBeParsedAsHTML('<span class="link">[someone@example.co</span>m](someone@example.com)');
+    expect('[someone@example.com](someone@example.com)').toBeParsedAsHTML(
+      '<span class="syntax">[</span>someone@example.com<span class="syntax">](</span><span class="link">someone@example.com</span><span class="syntax">)</span>',
+    );
   });
 
   test('label with "mailto:"', () => {
-    expect('[mailto:someone@example.com](someone@example.com)').toBeParsedAsHTML('<span class="link">[mailto:someone@exa</span>mple.com](someone@example.com)');
+    expect('[mailto:someone@example.com](someone@example.com)').toBeParsedAsHTML(
+      '<span class="syntax">[</span>mailto:someone@example.com<span class="syntax">](</span><span class="link">someone@example.com</span><span class="syntax">)</span>',
+    );
   });
 
   test('address with "mailto:"', () => {
-    expect('[someone@example.com](mailto:someone@example.com)').toBeParsedAsHTML('<span class="link">[someone@example.co</span>m](mailto:someone@example.com)');
+    expect('[someone@example.com](mailto:someone@example.com)').toBeParsedAsHTML(
+      '<span class="syntax">[</span>someone@example.com<span class="syntax">](</span><span class="link">mailto:someone@example.com</span><span class="syntax">)</span>',
+    );
   });
 
   test('label and address with "mailto:"', () => {
-    expect('[mailto:someone@example.com](mailto:someone@example.com)').toBeParsedAsHTML('<span class="link">[mailto:someone@exa</span>mple.com](mailto:someone@example.com)');
+    expect('[mailto:someone@example.com](mailto:someone@example.com)').toBeParsedAsHTML(
+      '<span class="syntax">[</span>mailto:someone@example.com<span class="syntax">](</span><span class="link">mailto:someone@example.com</span><span class="syntax">)</span>',
+    );
   });
 });
 
@@ -154,7 +164,7 @@ test('inline code', () => {
 });
 
 test('codeblock', () => {
-  expect('```\nHello world!\n```').toBeParsedAsHTML('<span class="syntax">```</span><br><span class="pre">Hello world!\n</span><span class="syntax">```</span>');
+  expect('```\nHello world!\n```').toBeParsedAsHTML('<span class="syntax">```</span><span class="pre"><br>Hello world!<br></span><span class="syntax">```</span>');
 });
 
 describe('quote', () => {
diff --git a/src/web/parserUtils.ts b/src/web/parserUtils.ts
index b3ee62b9..8e6b95ff 100644
--- a/src/web/parserUtils.ts
+++ b/src/web/parserUtils.ts
@@ -133,19 +133,19 @@ function parseRangesToHTMLNodes(text: string, ranges: MarkdownRange[], markdownS
       addStyling(span, range.type, markdownStyle);
     }
 
-    if (stack.length > 0 && nextRangeStartIndex < endOfCurrentRange) {
+    if (stack.length > 0 && nextRangeStartIndex < endOfCurrentRange && range.type !== 'syntax') {
       // tag nesting
       currentRoot.node.appendChild(span);
       nestedStack.push({node: span, endIndex: endOfCurrentRange});
       lastRangeEndIndex = range.startIndex;
     } else {
-      addSubstringAsTextNode(span, text, range.startIndex, endOfCurrentRange);
+      addTextWithNewlines(span, text, range.startIndex, endOfCurrentRange);
       currentRoot.node.appendChild(span);
       lastRangeEndIndex = endOfCurrentRange;
 
       // end of tag nesting
       while (nestedStack.length - 1 > 0 && nextRangeStartIndex >= currentRoot.endIndex) {
-        addSubstringAsTextNode(currentRoot.node, text, lastRangeEndIndex, currentRoot.endIndex);
+        addTextWithNewlines(currentRoot.node, text, lastRangeEndIndex, currentRoot.endIndex);
         const prevRoot = nestedStack.pop();
         if (!prevRoot) {
           break;
@@ -176,6 +176,7 @@ function parseText(target: HTMLElement, text: string, markdownStyle: PartialMark
     cursorPosition = CursorUtils.getCurrentCursorPosition(target).start;
   }
   const ranges = global.parseExpensiMarkToRanges(text);
+
   const markdownRanges: MarkdownRange[] = ranges.map((range) => {
     const [type, startIndex, length] = range;
     return {