     parseFloat element.css('flexGrow')
 
   setFlexGrow: (prevSize, nextSize) ->
-    flexGrow = @getFlexGrow(@prevPane) + @getFlexGrow(@nextPane)
+    flexGrow = @getFlexGrow(@prev()) + @getFlexGrow(@next())
     flexGrows = @calcRatio(prevSize, nextSize, flexGrow)
-    @prevPane.css('flexGrow', flexGrows[0].toString())
-    @nextPane.css('flexGrow', flexGrows[1].toString())
+    @prev().css('flexGrow', flexGrows[0].toString())
+    @next().css('flexGrow', flexGrows[1].toString())
 
   fixInRange: (val, minValue, maxValue) ->
     Math.min(Math.max(val, minValue), maxValue)


  attached: ->
    @isHorizontal = @parent().hasClass("horizontal")
    @prevPane = @prev()
    @nextPane = @next()

  detached: ->



  resizeToFitContent: ->
    # clear flex-grow css style of both pane
    @prev().css('flexGrow', '')
    @next().css('flexGrow', '')

  resizeStarted: (e)->
    e.stopPropagation()
