diff --git a/packages/web/components/patterns/HighlightView.tsx b/packages/web/components/patterns/HighlightView.tsx
index d12f3023e..c6539926b 100644
--- a/packages/web/components/patterns/HighlightView.tsx
+++ b/packages/web/components/patterns/HighlightView.tsx
@@ -118,7 +118,7 @@ export function HighlightView(props: HighlightViewProps): JSX.Element {
                 display: 'inline',
                 padding: '2px',
                 backgroundColor: `rgba(var(--colors-highlightBackground), ${highlightAlpha})`,
-                boxShadow: `1px 0 0 rgba(var(--colors-highlightBackground), ${highlightAlpha}), -1px 0 0 rgba(var(--colors-highlightBackground), ${highlightAlpha})`,
+                boxShadow: `3px 0 0 rgba(var(--colors-highlightBackground), ${highlightAlpha}), -3px 0 0 rgba(var(--colors-highlightBackground), ${highlightAlpha})`,
                 boxDecorationBreak: 'clone',
                 borderRadius: '2px',
               },
diff --git a/packages/web/lib/highlights/highlightGenerator.ts b/packages/web/lib/highlights/highlightGenerator.ts
index 07027d743..392d29d11 100644
--- a/packages/web/lib/highlights/highlightGenerator.ts
+++ b/packages/web/lib/highlights/highlightGenerator.ts
@@ -115,6 +115,11 @@ export function makeHighlightNodeAttributes(
     })
     const { parentNode, nextSibling } = node
 
+    if (node.textContent && !/[^\t\n\r ]/.test(node.textContent)) {
+      startingTextNodeIndex++
+      continue
+    }
+
     let isPre = false
     const nodeElement = node instanceof HTMLElement ? node : node.parentElement
     if (nodeElement) {