<script language="JavaScript">
<!--
function _AN_global_var_init(){
	_AN_this_url = "/prx/000/";
	_AN_base_scheme = "https";
	_AN_base_host = "https://patch-diff.githubusercontent.com";
	_AN_base_path = "https://patch-diff.githubusercontent.com/raw/jquery/jquery-ui/pull/";
	_AN_encode_urls = 0;
	_AN_mpo = 1;
	_AN_md = 0;
	_AN_rel_urls = 0;
	_AN_nav_switch = 0;
	_AN_nav_allowurl = 1;
	_AN_nav_override = 0;
	_AN_has_iframe = 0;
	_AN_dbg_flags = null;
	_AN_nav_use_aaa = 1;
	_AN_expires_pass = 0;
	_AN_wrap_evthandlers = 0;
	_AN_rewrite_param_exact = 0;
	_AN_obj_params = {};
} 
_AN_global_var_init();
//-->
</script>
<script language="JavaScript" src="/prx/001/http/localh/an_util.js"></script>
<script language="JavaScript" src="/prx/001/http/localh/NSLib.js"></script>

diff --git a/tests/unit/position/position.html b/tests/unit/position/position.html
index f3b1ad86ca8..21d4cc71b71 100644
--- a/tests/unit/position/position.html
+++ b/tests/unit/position/position.html
@@ -47,6 +47,9 @@
 	<div id="bug-5280" style="height: 30px; width: 201px;">
 		<div style="width: 50px; height: 10px;"></div>
 	</div>
+
+	<div id="bug-8710-within-smaller" style="position: absolute; width: 100px; height: 99px; top: 0px; left: 0px; line-height: 99px;"></div>
+	<div id="bug-8710-within-bigger" style="position: absolute; width: 100px; height: 101px; top: 0px; left: 0px; line-height: 101px;"></div>
 </div>
 
 </body>
diff --git a/tests/unit/position/position_core.js b/tests/unit/position/position_core.js
index e03d4c11152..d58699afcca 100644
--- a/tests/unit/position/position_core.js
+++ b/tests/unit/position/position_core.js
@@ -719,4 +719,41 @@ test( "bug #5280: consistent results (avoid fractional values)", function() {
 	deepEqual( offset1, offset2 );
 });
 
+test( "bug #8710: flip if flipped position fits more", function() {
+	expect( 3 );
+
+	// Positions a 10px tall element within 99px height at top 90px.
+	collisionTest({
+		within: "#bug-8710-within-smaller",
+		of: "#parentx",
+		collision: "flip",
+		at: "right bottom+30"
+	}, {
+		top: 0,
+		left: 60
+	}, "flip - top fits all" );
+
+	// Positions a 10px tall element within 99px height at top 92px.
+	collisionTest({
+		within: "#bug-8710-within-smaller",
+		of: "#parentx",
+		collision: "flip",
+		at: "right bottom+32"
+	}, {
+		top: -2,
+		left: 60
+	}, "flip - top fits more" );
+
+	// Positions a 10px tall element within 101px height at top 92px.
+	collisionTest({
+		within: "#bug-8710-within-bigger",
+		of: "#parentx",
+		collision: "flip",
+		at: "right bottom+32"
+	}, {
+		top: 92,
+		left: 60
+	}, "no flip - top fits less" );
+});
+
 }( jQuery ) );
diff --git a/ui/jquery.ui.position.js b/ui/jquery.ui.position.js
index 21c3cef1b19..314ebe5bca4 100644
--- a/ui/jquery.ui.position.js
+++ b/ui/jquery.ui.position.js
@@ -431,13 +431,13 @@ $.ui.position = {
 				newOverBottom;
 			if ( overTop < 0 ) {
 				newOverBottom = position.top + myOffset + atOffset + offset + data.collisionHeight - outerHeight - withinOffset;
-				if ( ( position.top + myOffset + atOffset + offset) > overTop && ( newOverBottom < 0 || newOverBottom < abs( overTop ) ) ) {
+				if ( newOverBottom < 0 || newOverBottom < abs( overTop ) ) {
 					position.top += myOffset + atOffset + offset;
 				}
 			}
 			else if ( overBottom > 0 ) {
 				newOverTop = position.top - data.collisionPosition.marginTop + myOffset + atOffset + offset - offsetTop;
-				if ( ( position.top + myOffset + atOffset + offset) > overBottom && ( newOverTop > 0 || abs( newOverTop ) < overBottom ) ) {
+				if ( newOverTop > 0 || abs( newOverTop ) < overBottom ) {
 					position.top += myOffset + atOffset + offset;
 				}
 			}
