From 9f74f546931a999290c82ea9c4f8c300e936347e Mon Sep 17 00:00:00 2001
From: Ville Karavirta <vkaravir@gmail.com>
Date: Thu, 14 Feb 2013 17:24:18 +0200
Subject: [PATCH] Better documentation of array width/height control

---
 doc/api.html | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/doc/api.html b/doc/api.html
index 291b4e5..39474b3 100644
--- a/doc/api.html
+++ b/doc/api.html
@@ -460,20 +460,30 @@ <h3 class="apitopic">CSS control</h3>
 There are various options and style effects that can be controlled via
 CSS.
 
-<h3 class="apimethod">width</h3>
+<h3 class="apimethod">width and height</h3>
 
-<p>Controls the width of a bar or array element. Example:</p>
+<p>By default, array elements are at minimum 45 pixels wide and will automatically expand if the content
+  is wider than that. Width and height can be controlled with the width/height CSS properties. Example:</p>
 
 <pre>
+.jsavarray .jsavindex {
+  width: 60px;
+}
+</pre>
+<p>Note, that JSAV has specified <code>min-width</code> for array indices to be 45 pixels. If you want to
+  make the indices smaller than that, you will also need to specify the <code>min-width</code> property. For 
+  example, to make indices 20px wide:<p>
+<pre>
 .jsavarray .jsavindex {
   width: 20px;
+  min-width: 20px;
 }
 </pre>
-<p>Note, that if you change the height of array elements, you should probably also change the line-height of the text inside. Example:</p>
+<p>If you change the height of array elements, you should probably also change the line-height of the text inside. Example:</p>
 <pre>
 .jsavarray .jsavindex {
-  height: 30px;
-  line-height: 30px
+  height: 20px;
+  line-height: 20px
 }
 </pre>