From 7c16c48e2a388490ccc0cbba88071731d4dabe94 Mon Sep 17 00:00:00 2001
From: Corey Johnson & Nathan Sobo <cj+nathan@github.com>
Date: Fri, 9 Nov 2012 11:12:33 -0700
Subject: [PATCH] Ensure underlayer and overlayer are always the same width as
 lines
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Also… simplify CSS rules for lines element. No display table or padding, instead we just set the min width when typing.
---
 spec/app/editor-spec.coffee |  4 ++--
 src/app/editor.coffee       |  2 +-
 static/editor.css           | 14 +++++---------
 3 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/spec/app/editor-spec.coffee b/spec/app/editor-spec.coffee
index 9951a7cb5..76b0cb33c 100644
--- a/spec/app/editor-spec.coffee
+++ b/spec/app/editor-spec.coffee
@@ -819,8 +819,8 @@ fdescribe "Editor", ->
           expect(region1.position().top).toBeCloseTo(2 * lineHeight)
           expect(region1.position().left).toBeCloseTo(7 * charWidth)
           expect(region1.height()).toBeCloseTo lineHeight
-          expect(region1.width()).toBeCloseTo(editor.renderedLines.outerWidth() - region1.position().left)
 
+          expect(region1.width()).toBeCloseTo(editor.renderedLines.outerWidth() - region1.position().left)
           region2 = selectionView.regions[1]
           expect(region2.position().top).toBeCloseTo(3 * lineHeight)
           expect(region2.position().left).toBeCloseTo(0)
@@ -837,8 +837,8 @@ fdescribe "Editor", ->
           expect(region1.position().top).toBeCloseTo(2 * lineHeight)
           expect(region1.position().left).toBeCloseTo(7 * charWidth)
           expect(region1.height()).toBeCloseTo lineHeight
-          expect(region1.width()).toBeCloseTo(editor.renderedLines.outerWidth() - region1.position().left)
 
+          expect(region1.width()).toBeCloseTo(editor.renderedLines.outerWidth() - region1.position().left)
           region2 = selectionView.regions[1]
           expect(region2.position().top).toBeCloseTo(3 * lineHeight)
           expect(region2.position().left).toBeCloseTo(0)
diff --git a/src/app/editor.coffee b/src/app/editor.coffee
index 8ba985af7..92afbe564 100644
--- a/src/app/editor.coffee
+++ b/src/app/editor.coffee
@@ -730,7 +730,7 @@ class Editor extends View
     @renderedLines.css('padding-bottom', heightOfRenderedLines)
 
   adjustMinWidthOfRenderedLines: ->
-    minWidth = @charWidth * @maxScreenLineLength()
+    minWidth = @charWidth * @maxScreenLineLength() + 20
     unless @renderedLines.cachedMinWidth == minWidth
       @renderedLines.css('min-width', minWidth)
       @underlayer.css('min-width', minWidth)
diff --git a/static/editor.css b/static/editor.css
index b090cf92d..7f7c29746 100644
--- a/static/editor.css
+++ b/static/editor.css
@@ -73,32 +73,28 @@
   overflow-x: hidden;
 }
 
-.editor .underlayer, .editor .overlayer {
-  pointer-events: none;
-  position: absolute;
+
+.editor .underlayer, .editor .lines, .editor .overlayer {
   width: 100%;
   height: 100%;
 }
 
 .editor .underlayer {
   z-index: 0;
+  position: absolute;
 }
 
 .editor .lines {
   position: relative;
-  display: table;
-  height: 100%;
-  width: 100%;
-  /*overflow: hidden; i'm worried this is causing rendering problems */
-  padding-right: 2em;
   z-index: 1;
 }
 
 .editor .overlayer {
   z-index: 2;
+  pointer-events: none;
+  position: absolute;
 }
 
-
 .editor .line span {
   vertical-align: top;
 }