f4667ab418c1ee653209ab6933ebf77e90a4ae7d
kate
  Thu Apr 5 19:35:47 2012 -0700
Fixes to support floating column header on IE
diff --git src/hg/js/encodeDataMatrix.js src/hg/js/encodeDataMatrix.js
index 922b0fe..868572b 100644
--- src/hg/js/encodeDataMatrix.js
+++ src/hg/js/encodeDataMatrix.js
@@ -108,45 +108,50 @@
         $thead.before('<colgroup></colgroup>');
 
         $.each(dataGroups, function (i, group) {
             $tableHeaders.append('<th class="groupType"><div class="verticalText">' + 
                                 group.label + '</div></th>');
             maxLen = Math.max(maxLen, group.label.length);
             $thead.before('<colgroup></colgroup>');
             $.each(group.dataTypes, function (i, label) {
                 dataType = encodeProject.getDataTypeByLabel(label);
 
                 // prune out datatypes with no experiments
                 if (dataTypeExps[dataType.term] !== undefined) {
                     $th = $('<th class="elementType"><div class="verticalText">' + 
                                 dataType.label + '</div></th>');
                     if (!encodeProject.isIE8()) {
-                        // Suppress mouseover under IE8 as QA noted flashing effect
+                        // Suppress mouseOver under IE8 as QA noted flashing effect
                         $th.attr('title', dataType.description);
                     }
                     $tableHeaders.append($th);
 
                     // add colgroup element to support cross-hair hover effect
                     $thead.before('<colgroup class="experimentCol"></colgroup>');
                     maxLen = Math.max(maxLen, dataType.label.length);
                 }
             });
         });
         // adjust size of headers based on longest label length
         // empirically len/2 em's is right
         $('#columnHeaders th').css('height', (String((maxLen/2 + 2)).concat('em')));
         $('#columnHeaders th').css('width', '1em');
+
+        //also need to set additional width for non-IE
+        if (!$.browser.msie) {
+            $('.verticalText').css('width', '1em');
+        }
     }
 
     function rowAddCells($row, dataGroups, dataTypeExps, matrix, cellType) {
         // populate a row in the matrix with cells for data groups and data types
         // null cellType indicates this is a row for a cell group (tier)
 
         var $td;
 
         $.each(dataGroups, function (i, group) {
             // skip group header
             $td = $('<td></td>');
             $td.addClass('matrixCell');
             $row.append($td);
 
             $.each(group.dataTypes, function (i, dataTypeLabel) {