 			width: @width + @knob.width 
 			height: @height + @knob.height
 			
-		@fill.height = @height
-		@knob.centerY()
+		if @width > @height 
+			@fill.height = @height
+			@knob.centerY()
+		else 
+			@fill.width = @width
+			@knob.centerX()
 			
 	_setRadius: =>
 		radius = @borderRadius


		@on("change:size", @_updateFrame)
		@on("change:borderRadius", @_setRadius)
		
		@knob.on("change:x", @_updateFill)
		@knob.on("change:size", @_updateKnob)

		@knob.on Events.Move, =>

		set: (value) -> @_max = value
		
	@define "value",
		get: -> 
			if @width > @height 
				@valueForPoint(@knob.midX)
			else 
				@valueForPoint(@knob.midY)

		set: (value) -> 
			if @width > @height 
				@knob.midX = @pointForValue(value)
			else 
				@knob.midY = @pointForValue(value)
			@_updateFill()

	_updateValue: =>
		@emit("change:value", @value)
	
	pointForValue: (value) ->
		if @width > @height
			return Utils.modulate(value, [@min, @max], [0, @width], true)
		else 
			return Utils.modulate(value, [@min, @max], [0, @height], true)
			
	valueForPoint: (value) ->
		if @width > @height
			return Utils.modulate(value, [0, @width], [@min, @max], true)
		else 
			return Utils.modulate(value, [0, @height], [@min, @max], true)
		
	animateToValue: (value, animationOptions={curve:"spring(300,25,0)"}) ->
		animationOptions.properties = {x:@pointForValue(value)}
