diff --git a/core/modules/widgets/reveal.js b/core/modules/widgets/reveal.js
index 3e3510f75..b582695cc 100755
--- a/core/modules/widgets/reveal.js
+++ b/core/modules/widgets/reveal.js
@@ -96,6 +96,21 @@ RevealWidget.prototype.positionPopup = function(domNode) {
 		left = Math.max(0,left);
 		top = Math.max(0,top);
 	}
+	if(this.clampToParent) {
+		var offsetParentDomNode = domNode.offsetParent,
+			parentWidth = offsetParentDomNode.offsetWidth,
+			parentHeight = offsetParentDomNode.offsetHeight,
+			right = left + domNode.offsetWidth,
+			bottom = top + domNode.offsetHeight;
+		if(domNode.offsetWidth <= parentWidth && right > parentWidth) {
+			left = parentWidth - domNode.offsetWidth;
+		}
+		if(domNode.offsetHeight <= parentHeight && bottom > parentHeight) {
+			top = parentHeight - domNode.offsetHeight;
+		}
+		// clamping on left and top sides is taken care of by positionAllowNegative
+	}
+	// TODO: clampToParent handling for absolute positions
 	if (this.popup.absolute) {
 		// Traverse the offsetParent chain and correct the offset to make it relative to the parent node.
 		for (var offsetParentDomNode = domNode.offsetParent; offsetParentDomNode; offsetParentDomNode = offsetParentDomNode.offsetParent) {
@@ -126,6 +141,7 @@ RevealWidget.prototype.execute = function() {
 	this.openAnimation = this.animate === "no" ? undefined : "open";
 	this.closeAnimation = this.animate === "no" ? undefined : "close";
 	this.updatePopupPosition = this.getAttribute("updatePopupPosition","no") === "yes";
+	this.clampToParent = this.getAttribute("clamp","no") === "yes";
 	// Compute the title of the state tiddler and read it
 	this.stateTiddlerTitle = this.state;
 	this.stateTitle = this.getAttribute("stateTitle");
diff --git a/editions/tw5.com/tiddlers/system/DefaultTiddlers.tid b/editions/tw5.com/tiddlers/system/DefaultTiddlers.tid
index e10c566b9..f95d35477 100644
--- a/editions/tw5.com/tiddlers/system/DefaultTiddlers.tid
+++ b/editions/tw5.com/tiddlers/system/DefaultTiddlers.tid
@@ -3,6 +3,7 @@ modified: 20140912135951542
 title: $:/DefaultTiddlers
 type: text/vnd.tiddlywiki
 
+[[Popup Clamping Demo]]
 HelloThere
 GettingStarted
 Community
diff --git a/editions/tw5.com/tiddlers/widgets/examples/RevealWidget (Popup Clamping Example).tid b/editions/tw5.com/tiddlers/widgets/examples/RevealWidget (Popup Clamping Example).tid
new file mode 100644
index 000000000..4c37a684b
--- /dev/null
+++ b/editions/tw5.com/tiddlers/widgets/examples/RevealWidget (Popup Clamping Example).tid	
@@ -0,0 +1,60 @@
+created: 20231218192649874
+modified: 20231219125925918
+tags: RevealWidget
+title: Popup Clamping Demo
+
+<style>
+.container {
+  display: grid;
+  grid-template-columns: repeat(5, 1fr);
+  grid-template-rows: repeat(5, 1fr);
+  width: 500px;
+  height: 500px;
+  overflow: hidden;
+  background-color: #F8F8F8;
+  position: relative;
+}
+.grid-item {
+    justify-self: center;
+    align-self: center;
+}
+.grid-popup .tc-drop-down {
+	padding: 1em;
+	min-width: 15em;
+}
+</style>
+
+<div class="container">
+	<$list filter="[range[25]]">
+		<div class="grid-item">
+			<$button popup="$:/state/popup-clamping">POP</$button>
+		</div>
+	</$list>
+	<$reveal type="popup"
+	         position={{{ [{$:/temp/clamp-demo-position}else[below]] }}}
+			 state="$:/state/popup-clamping"
+			 class="grid-popup"
+			 clamp={{{ [{$:/temp/clamp-demo-active}else[no]] }}}
+			 positionAllowNegative={{{ [{$:/temp/clamp-demo-allow-negative}else[no]] }}}>
+		<div class="tc-drop-down">
+
+		!! This is the popup
+		And this is some text
+		</div>
+	</$reveal>
+</div>
+
+<$checkbox tiddler="$:/temp/clamp-demo-active" field="text" checked="yes" unchecked="no" default="no"> Enable clamping</$checkbox>
+
+<$checkbox tiddler="$:/temp/clamp-demo-allow-negative" field="text" checked="yes" unchecked="no" default="no"> positionAllowNegative</$checkbox>
+
+<$select tiddler="$:/temp/clamp-demo-position" field="text" default="below">
+<option value="left">left</option>
+<option value="above">above</option>
+<option value="aboveleft">aboveleft</option>
+<option value="aboveright">aboveright</option>
+<option value="right">right</option>
+<option value="belowleft">belowleft</option>
+<option value="belowright">belowright</option>
+<option value="below">below</option>
+</$select>
\ No newline at end of file