     # element to get calculated height
     @_clone = $ '<div/>', { class: 'invisible' }
 
+    { type } = @getOptions()
+    isVertical = type.toLowerCase() is 'textarea'
+
+
     @on 'focus', =>
       @_clone.appendTo 'body'
       @_clone.css
-        height        : 'auto'
+        height        : if isVertical then 'auto' else $input.css 'height'
         zIndex        : 100000
-        width         : $input.css 'width'
+        width         : if isVertical then $input.css 'width' else 'auto'
         boxSizing     : $input.css 'box-sizing'
         borderTop     : $input.css 'border-top'
         borderRight   : $input.css 'border-right'

        fontSize      : $input.css 'fontSize'
        fontWeight    : $input.css 'fontWeight'
        lineHeight    : $input.css 'lineHeight'
        whiteSpace    : 'pre-line'

    @on 'blur', => @_clone.detach()

    @on 'input', (event) => KD.utils.defer => @resize event


  resize: (event) ->

    return  unless @_clone

    @_clone.appendTo 'body' unless document.body.contains @_clone[0]
    val = @getElement().value.replace(/\n/g,'\n&nbsp;')
    safeValue = Encoder.XSSEncode val
    @_clone.html safeValue

    height = @_clone.height()

    getValue = (rule) => parseInt @_clone.css(rule), 10

    if @$().css('boxSizing') is 'border-box'
      padding = getValue('paddingTop')     + getValue('paddingBottom')
      border  = getValue('borderTopWidth') + getValue('borderBottomWidth')
      height  = height + border + padding

    newHeight = if @initialHeight then Math.max @initialHeight, height else height

    @valid = yes
    @inputCallback = null
    @previousHeight = null
    @previousWidth = null
    @setName options.name
    @setLabel()
    @setCallback()
