diff --git a/canvas_modules/common-canvas/src/common-properties/controls/controls.scss b/canvas_modules/common-canvas/src/common-properties/controls/controls.scss
index 94c1db987..bad0c3690 100644
--- a/canvas_modules/common-canvas/src/common-properties/controls/controls.scss
+++ b/canvas_modules/common-canvas/src/common-properties/controls/controls.scss
@@ -44,6 +44,7 @@
 		display: flex;
 		> div:first-child {
 			width: 100%;
+			overflow-x: auto;
 		}
 	}
 }
diff --git a/docs/pages/04-common-properties.md b/docs/pages/04-common-properties.md
index 4aa415872..6071dd067 100644
--- a/docs/pages/04-common-properties.md
+++ b/docs/pages/04-common-properties.md
@@ -122,3 +122,19 @@ Pass the `<CommonProperties>` object into the `rightFlyoutContent` prop of Commo
         showRightFlyout={showRightFlyout}
     />
 ```
+
+
+If the `CommonProperties` component is nested inside single or multiple layers of `<div>` elements, special consideration is needed for proper layout behavior.
+
+```html
+    const rightFlyoutContent = (
+      <div className="parent-div">
+        <CommonProperties
+          propertiesInfo={this.propertiesInfo}
+          propertiesConfig={{ containerType: "Custom", rightFlyout: true }}
+          callbacks={this.callbacks}
+        />
+    </div>
+)
+
+`display: flex` should be added to `parent-div` to allow Common Properties content to occupy full width and height available in right flyout.