Wrap all characters temporarily in spans to force fixed with

Fixes #467

src/Renderer.ts

@@ -283,8 +283,12 @@ export class Renderer {
           }
         }
 
+        // TODO: Consider performance implications of not pulling these from the pool
         if (ch_width === 2) {
-          out += '<span class="xterm-wide-char">';
+          innerHTML += '<span class="xterm-wide-char">';
+        } else {
+          // TODO: Only wrap unicode characters that may vary in width
+          innerHTML += '<span class="xterm-normal-char">';
         }
         switch (ch) {
           case '&':
@@ -310,7 +314,10 @@ export class Renderer {
             break;
         }
         if (ch_width === 2) {
-          out += '</span>';
+          innerHTML += '</span>';
+        } else {
+          // TODO: Only wrap unicode characters that may vary in width
+          innerHTML += '</span>';
         }
 
         attr = data;

src/xterm.css

@@ -153,7 +153,8 @@
     overflow-y: scroll;
 }
 
-.terminal .xterm-wide-char {
+.terminal .xterm-wide-char,
+.terminal .xterm-normal-char {
     display: inline-block;
 }
 

src/xterm.js

@@ -760,7 +760,9 @@ Terminal.loadAddon = function(addon, callback) {
  * character width has been changed.
  */
 Terminal.prototype.updateCharSizeCSS = function() {
-  this.charSizeStyleElement.textContent = '.xterm-wide-char{width:' + (this.charMeasure.width * 2) + 'px;}';
+  this.charSizeStyleElement.textContent =
+      '.xterm-wide-char{width:' + (this.charMeasure.width * 2) + 'px;}' +
+      '.xterm-normal-char{width:' + this.charMeasure.width + 'px;}'
 }
 
 /**