diff --git a/ui/experiments/horisontal-stretch.html b/ui/experiments/horisontal-stretch.html
new file mode 100755
index 00000000..25d38a02
--- /dev/null
+++ b/ui/experiments/horisontal-stretch.html
@@ -0,0 +1,50 @@
+<script src="../jquery.js"></script>
+
+<style>
+
+.field {
+	width: auto;
+	overflow: visible;
+}
+
+.ribbon {
+	padding: 10px;
+	height: 100px;
+
+	width: auto;
+	overflow: visible;
+	white-space: nowrap;
+	font-size: 0px;
+}
+
+.image {
+	display: inline-block;
+	height: 80px;
+	width: 80px;
+	background: silver;
+}
+
+</style>
+
+<div class="field">
+	<div class="ribbon">
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+		<div class="image"></div>
+	</div>
+</div>
diff --git a/ui/gallery.css b/ui/gallery.css
index 20779852..7dfe1a79 100755
--- a/ui/gallery.css
+++ b/ui/gallery.css
@@ -100,7 +100,6 @@
 }
 
 .options .value {
-	/*float: right;*/
 	position: absolute;
 	right: 20px;
 	bottom: 10px;
@@ -116,7 +115,7 @@
 }
 
 .image {
-	float: left;
+	display: inline-block;
 
 	background: no-repeat 50% black;
 	background-size: contain;
@@ -304,9 +303,11 @@
 
 .ribbon {
 	height: 360px;
-	/* XXX make this expand dynamically */
-	width: 100000px;
+	width: auto;
 	overflow: visible;
+	white-space: nowrap;
+	word-spacing: 0px;
+	font-size: 0px;
 	padding-top: 2px;
 	padding-bottom: 2px;
 	opacity: 0.5;