--- a/web/data/cubicweb.facets.css	Thu Jan 08 10:50:30 2009 +0100
+++ b/web/data/cubicweb.facets.css	Thu Jan 08 12:12:40 2009 +0100
@@ -1,60 +1,63 @@
 #filterbox fieldset{
- margin:0px;
- padding:0px;
+ margin: 0px;
+ padding: 0px;
 } 
 
 div.facet {
- margin-bottom:8px;
+ margin-bottom: 8px;
  background: #fff;
  padding: 5px;
+ min-width: 10em;
 }
 
 div.facetTitle, div.bkSearch  {
  font-size: 80%;
- width:220px;
  color: #000;
- margin-bottom:2px;
+ margin-bottom: 2px;
  cursor: pointer; 
  font: bold 100% Georgia;
 }
-div.facetTitle a{ 
+
+div.facetTitle a { 
  padding-left: 10px;
  background: transparent url("puce.png") 0% 50% no-repeat;
  }
 
+div.facetBody {
+}
+
 .opened{  
  color: #000 !important; 
 }
 
-div.owerflowed{
-  height: 10em; 
-  overflow: auto;
+div.overflowed{
+  height: 12em; 
+  overflow-y: auto;
 }
 
 div.facetCheckBox {
-  clear:both;
+  clear: both;
   cursor: pointer;
 }
 
 div.facetCheckBox a {
  text-decoration: none;
- font-size:85%;
+ font-size: 85%;
 }
 
 div.facetValue{
-clear:both
+clear: both
 }
 
 div.facetValue img{
- width:16px; 
- float:left; 
- background:#fff;
+ float: left; 
+ background: #fff;
 }
 
 div.facetValue a {
- margin-left:20px; 
- display:block;
- margin-top:-6px; /* FIXME why do we need this ? */
+ margin-left: 20px; 
+ display: block;
+ margin-top: -6px; /* FIXME why do we need this ? */
 }
 
 div.facetValueSelected a {
@@ -95,10 +98,10 @@
   margin-top: 50px;
   margin-bottom: 1em;
   color: #1190A1;
-  font-size:75%;
-  font-weight:bold;
-  padding:0.15em;
-  text-transform:uppercase;
+  font-size: 75%;
+  font-weight: bold;
+  padding: 0.15em;
+  text-transform: uppercase;
 }
 
 

--- a/web/data/cubicweb.formfilter.js	Thu Jan 08 10:50:30 2009 +0100
+++ b/web/data/cubicweb.formfilter.js	Thu Jan 08 12:12:40 2009 +0100
@@ -107,12 +107,6 @@
 
 function initFacetBoxEvents(root){
     root = root || document;
-    jQuery(root).find('div.facetBody').each(function (){
-    	 var height = jQuery(this).height();
-	 if (height > 160){
-	     jQuery(this).addClass('owerflowed');
-	 }
-    });
     jQuery(root).find('form').each(function () {
 	var form = jQuery(this);
 	var facetargs = form.attr('cubicweb:facetargs');

--- a/web/facet.py	Thu Jan 08 10:50:30 2009 +0100
+++ b/web/facet.py	Thu Jan 08 12:12:40 2009 +0100
@@ -503,7 +503,10 @@
     def _render(self):
         title = html_escape(self.facet.title)
         facetid = html_escape(self.facet.id)
-        self.w(u'<div id="%s" class="facet">\n' % facetid)
+        if len(self.items) > 6:
+            self.w(u'<div id="%s" class="facet overflowed">\n' % facetid)
+        else:
+            self.w(u'<div id="%s" class="facet">\n' % facetid)
         self.w(u'<div class="facetTitle" cubicweb:facetName="%s">%s</div>\n' %
                (html_escape(facetid), title))
         if self.facet.support_and():
@@ -513,10 +516,9 @@
   <option value="AND">%s</option>
 </select>''' % (facetid + '_andor', _('and/or between different values'),
                 _('OR'), _('AND')))
-        if self.facet.start_unfolded:
-            cssclass = ''
-        else:
-            cssclass = ' hidden'
+        cssclass = ''
+        if not self.facet.start_unfolded:
+            cssclass += ' hidden'
         self.w(u'<div class="facetBody%s">\n' % cssclass)
         for item in self.items:
             item.render(self.w)