     sizer = jQuery('<div/>') #create jQuery element
     sizer.addClass SIZER_CLASS #make it stylable
 
-    #copy styles from text area to sizer node
-    sizer.attr('style', getComputedStyle(get(@, 'element'), "").cssText)
-
-    #hide the sizer node
-    sizer.css(
-      position: 'absolute'
-      zIndex: -1000
-      visibility: 'hidden'
-    )
-
-    #Insert the sizer node and stash a reference to it in a property
-    @$().after(sizer)
+    syncStyles = ->
+      #copy styles from text field to sizer node
+      element = get(@, 'element')
+      return unless element
+      sizer.attr('style', getComputedStyle(element, "").cssText)
+
+      #hide the sizer node
+      sizer.css(
+        position: 'absolute'
+        zIndex: -1000
+        visibility: 'hidden'
+        height: 'auto'
+      )
+
+      #Insert the sizer node
+      @$().after(sizer)
+
+    Ember.run.schedule 'afterRender', @, syncStyles
     set(@, SIZER_PROPERTY, sizer)
     sizer
 

  ###
  adjustHeight: Ember.observer ->
    sizer = @updateSizer()

    #Run later to allow the DOM to update sizer node prior to computing height
    Ember.run.later(@, ->
      height = +sizer.height()
      maxHeight = +get(@, 'maxHeight')
      height = maxHeight if maxHeight and height > maxHeight
      set @, 'height', height
    , 1)
  , "value", "hasFocus"

  ###
    Create an invisible element to "mirror" the text area. Uses a jQuery

    get(@, SIZER_PROPERTY)?.remove()
    set(@, SIZER_PROPERTY, null)
    null

  ###
    Handle insertion into the DOM.

    @event didInsertElement
  ###
  didInsertElement: ->
    @adjustHeight()
    @_super()

  ###
    Handle imminent destruction.
