diff --git a/ui (gen4)/ribbons.js b/ui (gen4)/ribbons.js
index 424ed63e..e49dd0ab 100755
--- a/ui (gen4)/ribbons.js	
+++ b/ui (gen4)/ribbons.js	
@@ -1554,6 +1554,36 @@ module.RibbonsPrototype = {
 		
 		return this
 	},
+	// NOTE: if fit_whole_images is true (default) this will fit a discrete
+	// 		number of images in width...
+	// XXX this does not account for ribbon spacing...
+	fitRibbon: function(n, fit_whole_images){
+		fit_whole_images = fit_whole_images == null ? true : false
+
+		var h = this.getVisibleImageSize('height', 1)
+		var scale = this.viewer.height() / (h * n)
+
+		var w = this.getVisibleImageSize('width', 1)
+		var W = this.viewer.width()
+
+		// n ribbons will be wider than the viewer...
+		if(w*scale >= W){
+			scale = W/w
+		}
+
+		// shift the scale to the point where screen width is a whole 
+		// number of images...
+		if(fit_whole_images){
+			var d = this.getScreenWidthImages(scale)
+			d = d / Math.ceil(d)
+
+			scale *= d
+		}
+
+		this.setScale(scale)
+
+		return this
+	},
 
 
 	_setup: function(viewer, images){
diff --git a/ui (gen4)/ui.js b/ui (gen4)/ui.js
index 7abadc47..c06bad30 100755
--- a/ui (gen4)/ui.js	
+++ b/ui (gen4)/ui.js	
@@ -135,12 +135,18 @@ module.GLOBAL_KEYBOARD = {
 			ctrl: 'fitOrig!',
 		},
 		'#2': 'fitTwo',
-		'#3': 'fitThree',
+		'#3': {
+			default: 'fitThree',
+			shift: 'fitThreeRibbons',
+		},
 		'#4': 'fitFour',
-		'#5': 'fitFive',
+		'#5': {
+			default: 'fitFive',
+			shift: 'fitFiveRibbons',
+		},
 		'#6': 'fitSix',
-		'#7': 'fitSeven',
-		'#8': 'fitEight',
+		'#7': 'fitSevenr',
+		'#8':'fitEight',
 		'#9': 'fitNine',
 		
 		'+': 'zoomIn',
diff --git a/ui (gen4)/viewer.js b/ui (gen4)/viewer.js
index 56eb7327..d2f983b7 100755
--- a/ui (gen4)/viewer.js	
+++ b/ui (gen4)/viewer.js	
@@ -839,6 +839,7 @@ actions.Actions(Client, {
 	fitMax: ['Fit the maximum number of images',
 		function(){ this.fitImage(this.config['max-screen-images']) }],
 
+
 	// XXX
 	fitSmall: ['Show small image',
 		function(){  }],
@@ -850,6 +851,18 @@ actions.Actions(Client, {
 		function(){  }],
 
 
+	fitRibbon: ['Fit ribbon vertically',
+		function(count){
+			this.ribbons.fitRibbon(count)
+			this.ribbons.updateImage('*')
+		}],
+
+	// XXX is n + 0.5 a good number here???
+	fitThreeRibbons: ['Fit three ribbons vertically', function(){ this.fitRibbon(3.5) }],
+	fitFiveRibbons: ['Fit five ribbons vertically', function(){ this.fitRibbon(5.5) }],
+	fitSevenRibbon: ['Fit seven ribbons vertically', function(){ this.fitRibbon(7.5) }],
+
+
 	// NOTE: these work by getting the target position from .data...
 	shiftImageTo: [ 
 		function(target){ return updateImagePosition(this, target) }],
@@ -1350,10 +1363,7 @@ module.CurrentImageIndicator = Feature({
 				}
 			})
 			// hide marker on shift left/right and show it after done shifting...
-			.on([
-					'shiftImageLeft.pre',
-					'shiftImageRight.pre',
-				], this.tag, function(){
+			.on('shiftImageLeft.pre shiftImageRight.pre', this.tag, function(){
 					this.ribbons.viewer.find('.current-marker').hide()
 					if(timeout != null){
 						clearTimeout(timeout)