diff --git a/src/static/css/iframe_editor.css b/src/static/css/iframe_editor.css
index 021c8d1fb..cd1ca0045 100644
--- a/src/static/css/iframe_editor.css
+++ b/src/static/css/iframe_editor.css
@@ -106,12 +106,12 @@ body.doesWrap:not(.noprewrap) > div {
 #sidediv:not(.sidedivdelayed) { /* before sidediv get initialized, hide text */
   color: transparent;
 }
-#sidediv.sidedivhidden {
-  /* Do not use display: none to hide the sidediv, otherwise the parent container does not
-       get its height properly calculated by flexboxes */
-  visibility: hidden;
-  width: 0;
-  padding: 0;
+.line-numbers-hidden #sidediv .line-number {
+  display: none;
+}
+#sidediv:not(.authorColors) #sidedivinner>div:before {
+  content: none !important;
+}
 }
 #linemetricsdiv {
   position: absolute;
diff --git a/src/static/js/ace2_inner.js b/src/static/js/ace2_inner.js
index b69cc1686..851934856 100644
--- a/src/static/js/ace2_inner.js
+++ b/src/static/js/ace2_inner.js
@@ -956,8 +956,7 @@ function Ace2Inner(){
       showsuserselections: setClassPresenceNamed(root, "userSelections"),
       showslinenumbers : function(value){
         hasLineNumbers = !! value;
-        setClassPresence(sideDiv, "sidedivhidden", !hasLineNumbers);
-        setClassPresence(sideDiv.parentNode, "sidediv-hidden", !hasLineNumbers);
+        setClassPresence(sideDiv.parentNode, "line-numbers-hidden", !hasLineNumbers);
         fixView();
       },
       grayedout: setClassPresenceNamed(outerWin.document.body, "grayedout"),
@@ -5275,7 +5274,7 @@ function Ace2Inner(){
   function initLineNumbers()
   {
     lineNumbersShown = 1;
-    sideDiv.innerHTML = '<div id="sidedivinner" class="sidedivinner"><div>1</div></div>';
+    sideDiv.innerHTML = '<div id="sidedivinner" class="sidedivinner"><div><span class="line-number">1</span></div></div>';
     sideDivInner = outerWin.document.getElementById("sidedivinner");
     $(sideDiv).addClass("sidediv");
   }
@@ -5352,7 +5351,7 @@ function Ace2Inner(){
           div.style.height = h +"px";
         }
 
-        div.appendChild(odoc.createTextNode(String(n)));
+        $(div).append($("<span class='line-number'>" + String(n) + "</span>"));
         fragment.appendChild(div);
         if(b){
           b = b.nextSibling;
diff --git a/src/static/js/pad_editor.js b/src/static/js/pad_editor.js
index b035bf6fc..6c53e4014 100644
--- a/src/static/js/pad_editor.js
+++ b/src/static/js/pad_editor.js
@@ -135,6 +135,7 @@ var padeditor = (function()
       v = getOption('showAuthorColors', true);
       self.ace.setProperty("showsauthorcolors", v);
       $('#chattext').toggleClass('authorColors', v);
+      $('iframe[name="ace_outer"]').contents().find('#sidedivinner').toggleClass('authorColors', v);
       padutils.setCheckbox($("#options-colorscheck"), v);
 
       // Override from parameters if true