From 7517283d5d640863683b7caf1969164df19d9d40 Mon Sep 17 00:00:00 2001
From: Sergio Padrino <sergio.padrino@gmail.com>
Date: Mon, 25 Sep 2023 18:45:47 +0200
Subject: [PATCH] Wrap actual line contents so they're not affected by parent's
 `display: flex`

---
 app/src/ui/diff/side-by-side-diff-row.tsx | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/app/src/ui/diff/side-by-side-diff-row.tsx b/app/src/ui/diff/side-by-side-diff-row.tsx
index b3fc212aff..007fc517ef 100644
--- a/app/src/ui/diff/side-by-side-diff-row.tsx
+++ b/app/src/ui/diff/side-by-side-diff-row.tsx
@@ -357,13 +357,15 @@ export class SideBySideDiffRow extends React.Component<
     return (
       <div className="content" onContextMenu={this.props.onContextMenuText}>
         <div className="prefix">&nbsp;&nbsp;{prefix}&nbsp;&nbsp;</div>
-        {syntaxHighlightLine(data.content, data.tokens)}
-        {data.noNewLineIndicator && (
-          <Octicon
-            symbol={narrowNoNewlineSymbol}
-            title="No newline at end of file"
-          />
-        )}
+        <div className="content-wrapper">
+          {syntaxHighlightLine(data.content, data.tokens)}
+          {data.noNewLineIndicator && (
+            <Octicon
+              symbol={narrowNoNewlineSymbol}
+              title="No newline at end of file"
+            />
+          )}
+        </div>
       </div>
     )
   }