diff --git a/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.jsx b/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.jsx
index ce6947c6c..c8afbe1a1 100644
--- a/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.jsx
+++ b/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.jsx
@@ -90,7 +90,7 @@ class ControlItem extends React.Component {
 
 		const action = this.actionFactory.generateAction(0, this.props.control.action);
 
-		const className = classNames("properties-control-item", { "hide": hidden });
+		const className = classNames("properties-control-item", { "hide": hidden }, { "properties-ci-action-item": action });
 
 		/*
 		* <ControlItem /> should be called from every control.
@@ -111,10 +111,14 @@ class ControlItem extends React.Component {
 			<div data-id={"properties-ci-" + this.props.control.name}
 				className={className} disabled={disabled}
 			>
-				{label}
-				{description}
-				{this.props.controlObj}
-				{action}
+				<div className="properties-ci-content-container">
+					{label}
+					{description}
+					{this.props.controlObj}
+				</div>
+				<div className="properties-ci-action-container">
+					{action}
+				</div>
 			</div>
 		);
 	}
diff --git a/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.scss b/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.scss
index 58f8ed820..126f97b45 100644
--- a/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.scss
+++ b/canvas_modules/common-canvas/src/common-properties/components/control-item/control-item.scss
@@ -36,6 +36,11 @@
 	}
 }
 
+.properties-ci-action-item {
+	display: flex;
+	justify-content: space-between;
+}
+
 .properties-label-container {
 	display: flex;
 	align-items: center;