diff --git a/xCAT-UI/css/style.css b/xCAT-UI/css/style.css
index 8f47ffcce..6ee975199 100644
--- a/xCAT-UI/css/style.css
+++ b/xCAT-UI/css/style.css
@@ -689,31 +689,28 @@ table a:hover {
 
 /*--------------- Provision and monitor forms ---------------*/
 .monitornormal {
-	border: 2px outset #7FFFD4;
 	background: #66CD00;
 	cursor: pointer;
 }
 
 .mornitorwarning {
    	background: #FFD700;
-  	border: 2px outset #EEEE00;
 	cursor: pointer;
 }
 
 .monitorerror {
 	background:  #FF3030;
-	border: 2px outset #FF4040;
 }
 
 .monitorunknown {
     background:  #8B8B7A;
-    border: 2px outset #858585;
 }
 
 .monitornodeli {
-	width: 16px;
-	height: 16px;
+	width: 10px;
+	height: 10px;
 	float: left;
+	border: 1px solid white;
 }
 
 .monitorsumdiv {
diff --git a/xCAT-UI/js/monitor/gangliamon.js b/xCAT-UI/js/monitor/gangliamon.js
index 2ffc87373..184937860 100644
--- a/xCAT-UI/js/monitor/gangliamon.js
+++ b/xCAT-UI/js/monitor/gangliamon.js
@@ -154,14 +154,18 @@ function checkGangliaRunning(data){
     groupsSelectStr += '</select>';
     
     //help info
-    var helpStr = '<div class="tooltip">aaa</div>';
+    var helpStr = '<table style="float:right"><tr>' +
+                  '<td style="background:#66CD00;width:16px;padding:0px;"> </td><td style="padding:0px;border:0px">Normal</td>' +
+                  '<td style="background:#FFD700;width:16px;padding:0px;"> </td><td style="padding:0px;">Heavy Load</td>' +
+                  '<td style="background:#FF3030;width:16px;padding:0px;"> </td><td style="padding:0px;">Error</td>' +
+                  '<td style="background:#8B8B7A;width:16px;padding:0px;"> </td><td style="padding:0px;">Unknown</td>' +
+                  '</tr></table>';
     
     //pass checking
-    var showStr = '<h3 style="display:inline;">Grid Overview</h3>' +
-                  '<sup id="hidesup" style="cursor: pointer;color:blue">[Hide]</sup><hr>' +
+    var showStr = '<div><h3 style="display:inline;">Grid Overview</h3>' +
+                  '<sup id="hidesup" style="cursor: pointer;color:blue;float:right">[Hide]</sup></div><hr>' +
                   '<div id="gangliaGridSummary"></div>' +
-                  '<h3 style="display:inline;">Nodes Current Status</h3>' +
-                  '<sup id="nodehelp" style="cursor: pointer;color:blue"> ?</sup>' +
+                  '<div><h3 style="display:inline;">Nodes Current Status</h3>' + helpStr + '</div>' +
                   '<hr>Nodes in Group:' + groupsSelectStr +
                   ' order by: <select id="gangliaorder" style="padding:0px;"><option value="name">Name</option>' +
                   '<option value="asc">Ascending</option><option value="des">Descending</option></select>' +
@@ -194,29 +198,6 @@ function checkGangliaRunning(data){
         drawGangliaNodesArea($(this).val());
     });
     
-    //bind the info click enent
-    $('#gangliamon #nodehelp').bind('click', function(){
-        var helpStr = '<table>' +
-                      '<tr><td style="background:#66CD00;" width="16px"> </td><td>Normal</td></tr>' +
-                      '<tr><td style="background:#FFD700;" width="16px"> </td><td>Heavy Load</td></tr>' +
-                      '<tr><td style="background:#FF3030;" width="16px"> </td><td>Can not get status longer than 3 minutes</td></tr>' +
-                      '<tr><td style="background:#8B8B7A;" width="16px"> </td><td>Unknown</td></tr>' +
-                      '</table>';
-        var helpDia = $('<div></div>');
-        helpDia.append(helpStr);
-        helpDia.dialog({
-            modal: true,
-            width: 350,
-            title: 'Node Status Help Info',
-            close: function(){$(this).remove();},
-            buttons: {
-                'Close': function(){
-                    $(this).dialog('close');
-                }
-            }
-        });
-    });
-    
     //bind the hide/show buttion event
     $('#gangliamon #hidesup').bind('click', function(){
         var a = $(this).text();