diff --git a/client/app/scripts/charts/nodes-grid.js b/client/app/scripts/charts/nodes-grid.js
index 4f2d46369..e05172f7d 100644
--- a/client/app/scripts/charts/nodes-grid.js
+++ b/client/app/scripts/charts/nodes-grid.js
@@ -18,7 +18,7 @@ function getColumns(nodes) {
     .toList()
     .flatMap(n => {
       const metrics = (n.get('metrics') || makeList())
-        .map(m => makeMap({ id: m.get('id'), label: m.get('label') }));
+        .map(m => makeMap({ id: m.get('id'), label: m.get('label'), dataType: 'number' }));
       return metrics;
     })
     .toSet()
@@ -29,7 +29,7 @@ function getColumns(nodes) {
     .toList()
     .flatMap(n => {
       const metadata = (n.get('metadata') || makeList())
-        .map(m => makeMap({ id: m.get('id'), label: m.get('label') }));
+        .map(m => makeMap({ id: m.get('id'), label: m.get('label'), dataType: m.get('dataType') }));
       return metadata;
     })
     .toSet()
diff --git a/client/app/scripts/components/node-details/node-details-table-row.js b/client/app/scripts/components/node-details/node-details-table-row.js
index 7948450a1..b312e0a83 100644
--- a/client/app/scripts/components/node-details/node-details-table-row.js
+++ b/client/app/scripts/components/node-details/node-details-table-row.js
@@ -32,11 +32,11 @@ function getValuesForNode(node) {
 }
 
 
-function renderValues(node, columns = [], columnWidths = []) {
+function renderValues(node, columns = [], columnStyles = []) {
   const fields = getValuesForNode(node);
   return columns.map(({id}, i) => {
     const field = fields[id];
-    const style = { width: columnWidths[i] };
+    const style = columnStyles[i];
     if (field) {
       if (field.valueType === 'metadata') {
         return (
@@ -119,9 +119,9 @@ export default class NodeDetailsTableRow extends React.Component {
 
   render() {
     const { node, nodeIdKey, topologyId, columns, onClick, onMouseEnterRow, onMouseLeaveRow,
-      selected, widths } = this.props;
-    const [firstColumnWidth, ...columnWidths] = widths;
-    const values = renderValues(node, columns, columnWidths);
+      selected, colStyles } = this.props;
+    const [firstColumnStyle, ...columnStyles] = colStyles;
+    const values = renderValues(node, columns, columnStyles);
     const nodeId = node[nodeIdKey];
     const className = classNames('node-details-table-node', { selected });
 
@@ -133,7 +133,7 @@ export default class NodeDetailsTableRow extends React.Component {
         onMouseLeave={onMouseLeaveRow && this.onMouseLeave}
         className={className}>
         <td ref={this.storeLabelRef} className="node-details-table-node-label truncate"
-          style={{ width: firstColumnWidth }}>
+          style={firstColumnStyle}>
           {this.props.renderIdCell(Object.assign(node, {topologyId, nodeId}))}
         </td>
         {values}
diff --git a/client/app/scripts/components/node-details/node-details-table.js b/client/app/scripts/components/node-details/node-details-table.js
index e7c19e235..31db1870f 100644
--- a/client/app/scripts/components/node-details/node-details-table.js
+++ b/client/app/scripts/components/node-details/node-details-table.js
@@ -117,28 +117,34 @@ function getSortedNodes(nodes, columns, sortBy, sortedDesc) {
 }
 
 
-function getColumnsWidths(headers) {
-  return headers.map((h, i) => {
-    //
-    // Beauty hack: adjust first column width if there are only few columns;
-    // this assumes the other columns are narrow metric columns of 20% table width
-    //
-    if (i === 0) {
-      if (headers.length === 2) {
-        return '66%';
-      } else if (headers.length === 3) {
-        return '50%';
-      } else if (headers.length > 3 && headers.length <= 5) {
-        return '33%';
-      }
+function getColumnWidth(headers, h, i) {
+  //
+  // Beauty hack: adjust first column width if there are only few columns;
+  // this assumes the other columns are narrow metric columns of 20% table width
+  //
+  if (i === 0) {
+    if (headers.length === 2) {
+      return '66%';
+    } else if (headers.length === 3) {
+      return '50%';
+    } else if (headers.length > 3 && headers.length <= 5) {
+      return '33%';
     }
+  }
 
-    //
-    // More beauty hacking, ports and counts can only get so big, free up WS for other longer
-    // fields like IPs!
-    //
-    return COLUMN_WIDTHS[h.id];
-  });
+  //
+  // More beauty hacking, ports and counts can only get so big, free up WS for other longer
+  // fields like IPs!
+  //
+  return COLUMN_WIDTHS[h.id];
+}
+
+
+function getColumnsStyles(headers) {
+  return headers.map((h, i) => ({
+    width: getColumnWidth(headers, h, i),
+    textAlign: h.dataType === 'number' ? 'right' : 'left',
+  }));
 }
 
 
@@ -177,7 +183,7 @@ export default class NodeDetailsTable extends React.Component {
   renderHeaders() {
     if (this.props.nodes && this.props.nodes.length > 0) {
       const headers = this.getColumnHeaders();
-      const widths = getColumnsWidths(headers);
+      const colStyles = getColumnsStyles(headers);
       const defaultSortBy = getDefaultSortBy(this.props.columns, this.props.nodes);
 
       return (
@@ -196,14 +202,8 @@ export default class NodeDetailsTable extends React.Component {
               headerClasses.push('node-details-table-header-sorted');
             }
 
-            // set header width in percent
-            const style = {};
-            if (widths[i]) {
-              style.width = widths[i];
-            }
-
             return (
-              <td className={headerClasses.join(' ')} style={style} onClick={onHeaderClick}
+              <td className={headerClasses.join(' ')} style={colStyles[i]} onClick={onHeaderClick}
                 title={header.label} key={header.id}>
                 {isSortedAsc
                   && <span className="node-details-table-header-sorter fa fa-caret-up" />}
@@ -251,7 +251,7 @@ export default class NodeDetailsTable extends React.Component {
                   selected={this.props.selectedNodeId === node.id}
                   node={node}
                   nodeIdKey={nodeIdKey}
-                  widths={getColumnsWidths(this.getColumnHeaders())}
+                  colStyles={getColumnsStyles(this.getColumnHeaders())}
                   columns={columns}
                   onClick={onClickRow}
                   onMouseLeaveRow={onMouseLeaveRow}
diff --git a/probe/process/reporter.go b/probe/process/reporter.go
index 4b7bfc400..c0f8dd529 100644
--- a/probe/process/reporter.go
+++ b/probe/process/reporter.go
@@ -24,8 +24,8 @@ var (
 	MetadataTemplates = report.MetadataTemplates{
 		PID:     {ID: PID, Label: "PID", From: report.FromLatest, Datatype: "number", Priority: 1},
 		Cmdline: {ID: Cmdline, Label: "Command", From: report.FromLatest, Priority: 2},
-		PPID:    {ID: PPID, Label: "Parent PID", From: report.FromLatest, Priority: 3},
-		Threads: {ID: Threads, Label: "# Threads", From: report.FromLatest, Priority: 4},
+		PPID:    {ID: PPID, Label: "Parent PID", From: report.FromLatest, Datatype: "number", Priority: 3},
+		Threads: {ID: Threads, Label: "# Threads", From: report.FromLatest, Datatype: "number", Priority: 4},
 	}
 
 	MetricTemplates = report.MetricTemplates{