diff --git a/awx/ui/client/src/instance-groups/capacity-bar/capacity-bar.directive.js b/awx/ui/client/src/instance-groups/capacity-bar/capacity-bar.directive.js
index 872e2ac0be..e4f34063ce 100644
--- a/awx/ui/client/src/instance-groups/capacity-bar/capacity-bar.directive.js
+++ b/awx/ui/client/src/instance-groups/capacity-bar/capacity-bar.directive.js
@@ -23,10 +23,10 @@ export default ['templateUrl', 'ComponentsStrings',
                 scope.$watch('capacity', function() {
                     if (scope.totalCapacity !== 0) {
                         scope.CapacityStyle = {
-                            'flex-grow': scope.capacity * 0.01
+                            'flex-grow': scope.capacity / scope.totalCapacity * 0.01
                         };
 
-                        scope.consumedCapacity = `${scope.capacity}%`;
+                        scope.consumedCapacity = `${Math.round(scope.capacity / scope.totalCapacity * 10) / 10}%`;
                     } else {
                         scope.CapacityStyle = {
                             'flex-grow': 1