Set proper player width in base renderer

app/assets/javascripts/player/renderers/base.js.coffee

@@ -25,6 +25,13 @@ class AsciiIo.Renderer.Base extends Backbone.View
     @cellWidth = sample.width()
     @cellHeight = sample.height()
     sample.remove()
+    @fixTerminalElementSize()
+    @fixPlayerContainerSize()
+
+  fixTerminalElementSize: ->
+
+  fixPlayerContainerSize: ->
+    @$el.parent('.player').css(width: @$el.outerWidth() + 'px')
 
   showCursor: (show) ->
     throw '#showCursor not implemented'

app/assets/javascripts/player/renderers/canvas.js.coffee

@@ -11,19 +11,13 @@ class AsciiIo.Renderer.Canvas extends AsciiIo.Renderer.Base
     @cursorOn = true
     @cursorVisible = true
 
-  afterInsertedToDom: ->
-    super()
-    @fixSize()
-
-  fixSize: ->
+  fixTerminalElementSize: ->
     width = @cols * @cellWidth
     height = @lines * @cellHeight
 
     @$el.attr('width', width)
     @$el.attr('height', height)
 
-    @$el.parent('.player').css(width: width + 'px')
-
     @setFont()
 
   setFont: ->

app/assets/javascripts/player/renderers/pre.js.coffee

@@ -17,16 +17,11 @@ class AsciiIo.Renderer.Pre extends AsciiIo.Renderer.Base
       @$el.append "\n"
       i++
 
-  afterInsertedToDom: ->
-    super()
-    @fixSize()
-
-  fixSize: ->
+  fixTerminalElementSize: ->
     width = @cols * @cellWidth
     height = @lines * @cellHeight
 
     @$el.css(width: width + 'px', height: height + 'px')
-    @$el.parent('.player').css(width: @$el.outerWidth() + 'px')
 
   render: (changes, cursorX, cursorY) ->
     @$el.find('.cursor').removeClass('cursor')

app/assets/stylesheets/player.css.scss

@@ -53,12 +53,13 @@ $color5: #EDC951;
 
   .terminal {
     overflow: hidden;
-    padding: 2px;
+    padding: 3px;
     margin: 0px;
     display: block;
     white-space: pre;
     background-color: black;
     color: #ccc;
+    border: 0;
 
     .line {
       /* background-color: black;*/