diff --git a/css/css-position/position-absolute-center-005.html b/css/css-position/position-absolute-center-005.html
deleted file mode 100644
index c586719f8e2b1c..00000000000000
--- a/css/css-position/position-absolute-center-005.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<!DOCTYPE html>
-<link rel="help" href="https://crbug.com/1236657">
-<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
-<meta name="assert" content="A button element should be centered with auto margins and zero insets.">
-<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
-<div style="position: relative; width: 200px; height: 100px; margin-left: -50px;">
-  <button style="position: absolute; background: green; appearance: none; padding: 0; border: none; left: 0; right: 0; margin: auto; height: 100px;">
-    <div style="width: 100px;"></div>
-  </button>
-</div>
diff --git a/css/css-position/position-absolute-semi-replaced-stretch-button-ref.html b/css/css-position/position-absolute-semi-replaced-stretch-button-ref.html
new file mode 100644
index 00000000000000..25176a62b1ae87
--- /dev/null
+++ b/css/css-position/position-absolute-semi-replaced-stretch-button-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<style>
+.cb {
+  position: relative;
+  border: 3px solid black;
+  height: 100px;
+  width: 150px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 5px;
+}
+.wide {
+  width: 350px;
+}
+.abs {
+  margin: 0;
+  position: absolute;
+  box-sizing: border-box;
+  top: 3px;
+  left: 3px;
+  outline: 2px solid lime;
+  width: calc(100% - 6px);
+  height: calc(100% - 6px);
+}
+</style>
+<div class="cb"><button class="abs">button</button></div>
diff --git a/css/css-position/position-absolute-semi-replaced-stretch-button.html b/css/css-position/position-absolute-semi-replaced-stretch-button.html
new file mode 100644
index 00000000000000..4e04e9ffc0065a
--- /dev/null
+++ b/css/css-position/position-absolute-semi-replaced-stretch-button.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/6789">
+<link rel="match" href="position-absolute-semi-replaced-stretch-button-ref.html">
+<title>Semi-replaced elements should stretch with an auto main size, and explicit insets in that direction.</title>
+<style>
+.cb {
+  position: relative;
+  border: 3px solid black;
+  height: 100px;
+  width: 150px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 5px;
+}
+.wide {
+  /* Some of the form controls are wider than others
+     and need a wider CB in order to see if they're
+     stretching or shrinking. */
+  width: 350px;
+}
+.abs {
+  margin: 0;
+  position: absolute;
+  box-sizing: border-box;
+  top: 3px;
+  right: 3px;
+  bottom: 3px;
+  left: 3px;
+  outline: 2px solid lime;
+  width: auto;
+  height: auto;
+}
+</style>
+<div class="cb"><button class="abs">button</button></div>
diff --git a/css/css-position/position-absolute-semi-replaced-stretch-input-ref.html b/css/css-position/position-absolute-semi-replaced-stretch-input-ref.html
new file mode 100644
index 00000000000000..554173c6323bd1
--- /dev/null
+++ b/css/css-position/position-absolute-semi-replaced-stretch-input-ref.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<style>
+.cb {
+  position: relative;
+  border: 3px solid black;
+  height: 100px;
+  width: 150px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 5px;
+}
+.wide {
+  width: 350px;
+}
+.abs {
+  margin: 0;
+  position: absolute;
+  box-sizing: border-box;
+  top: 3px;
+  left: 3px;
+  outline: 2px solid lime;
+  width: calc(100% - 6px);
+  height: calc(100% - 6px);
+}
+</style>
+<div class="cb"><input type="button" class="abs" value="input-btn"></div>
+<div class="cb"><input type="submit" class="abs"></div>
+<div class="cb"><input type="reset" class="abs"></div>
+<div class="cb"><input type="color" class="abs"></div>
+<div class="cb wide"><input type="text" class="abs" value="text"></div>
+<div class="cb wide"><input type="password" class="abs" value="pass"></div>
+<div class="cb wide"><input type="date" class="abs" value="text"></div>
+<div class="cb wide"><input type="file" class="abs"></div>
+<div class="cb wide"><input type="range" class="abs"></div>
diff --git a/css/css-position/position-absolute-semi-replaced-stretch-input.html b/css/css-position/position-absolute-semi-replaced-stretch-input.html
new file mode 100644
index 00000000000000..6080f63c101994
--- /dev/null
+++ b/css/css-position/position-absolute-semi-replaced-stretch-input.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/6789">
+<link rel="match" href="position-absolute-semi-replaced-stretch-input-ref.html">
+<title>Semi-replaced elements should stretch with an auto main size, and explicit insets in that direction.</title>
+<style>
+.cb {
+  position: relative;
+  border: 3px solid black;
+  height: 100px;
+  width: 150px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 5px;
+}
+.wide {
+  /* Some of the form controls are wider than others
+     and need a wider CB in order to see if they're
+     stretching or shrinking. */
+  width: 350px;
+}
+.abs {
+  margin: 0;
+  position: absolute;
+  box-sizing: border-box;
+  top: 3px;
+  right: 3px;
+  bottom: 3px;
+  left: 3px;
+  outline: 2px solid lime;
+  width: auto;
+  height: auto;
+}
+</style>
+<div class="cb"><input type="button" class="abs" value="input-btn"></div>
+<div class="cb"><input type="submit" class="abs"></div>
+<div class="cb"><input type="reset" class="abs"></div>
+<div class="cb"><input type="color" class="abs"></div>
+<div class="cb wide"><input type="text" class="abs" value="text"></div>
+<div class="cb wide"><input type="password" class="abs" value="pass"></div>
+<div class="cb wide"><input type="date" class="abs" value="text"></div>
+<div class="cb wide"><input type="file" class="abs"></div>
+<div class="cb wide"><input type="range" class="abs"></div>
diff --git a/css/css-position/position-absolute-semi-replaced-stretch-other-ref.html b/css/css-position/position-absolute-semi-replaced-stretch-other-ref.html
new file mode 100644
index 00000000000000..e334bc0f63d9a5
--- /dev/null
+++ b/css/css-position/position-absolute-semi-replaced-stretch-other-ref.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<style>
+.cb {
+  position: relative;
+  border: 3px solid black;
+  height: 100px;
+  width: 150px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 5px;
+}
+.wide {
+  width: 350px;
+}
+.abs {
+  margin: 0;
+  position: absolute;
+  box-sizing: border-box;
+  top: 3px;
+  left: 3px;
+  outline: 2px solid lime;
+  width: calc(100% - 6px);
+  height: calc(100% - 6px);
+}
+</style>
+<div class="cb"><select class="abs"><option>select</option></select></div>
+<div class="cb"><output class="abs">output</output></div>
+<div class="cb"><label class="abs">label</output></div>
+<div class="cb"><fieldset class="abs">fieldset</fieldset></div>
+<div class="cb wide"><textarea class="abs">textarea</textarea></div>
+<div class="cb wide"><progress value="0.4" class="abs"></div>
+<div class="cb wide"><meter value="0.4" class="abs"></div>
diff --git a/css/css-position/position-absolute-semi-replaced-stretch-other.html b/css/css-position/position-absolute-semi-replaced-stretch-other.html
new file mode 100644
index 00000000000000..21fc2c84e3d658
--- /dev/null
+++ b/css/css-position/position-absolute-semi-replaced-stretch-other.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/6789">
+<link rel="match" href="position-absolute-semi-replaced-stretch-other-ref.html">
+<title>Semi-replaced elements should stretch with an auto main size, and explicit insets in that direction.</title>
+<style>
+.cb {
+  position: relative;
+  border: 3px solid black;
+  height: 100px;
+  width: 150px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 5px;
+}
+.wide {
+  /* Some of the form controls are wider than others
+     and need a wider CB in order to see if they're
+     stretching or shrinking. */
+  width: 350px;
+}
+.abs {
+  margin: 0;
+  position: absolute;
+  box-sizing: border-box;
+  top: 3px;
+  right: 3px;
+  bottom: 3px;
+  left: 3px;
+  outline: 2px solid lime;
+  width: auto;
+  height: auto;
+}
+</style>
+<div class="cb"><select class="abs"><option>select</option></select></div>
+<div class="cb"><output class="abs">output</output></div>
+<div class="cb"><label class="abs">label</output></div>
+<div class="cb"><fieldset class="abs">fieldset</fieldset></div>
+<div class="cb wide"><textarea class="abs">textarea</textarea></div>
+<div class="cb wide"><progress value="0.4" class="abs"></div>
+<div class="cb wide"><meter value="0.4" class="abs"></div>
diff --git a/html/rendering/widgets/button-layout/abspos.html b/html/rendering/widgets/button-layout/abspos.html
deleted file mode 100644
index c3089b1e39749e..00000000000000
--- a/html/rendering/widgets/button-layout/abspos.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<!doctype html>
-<title>abspos button with auto width, non-auto left/right</title>
-<script src=/resources/testharness.js></script>
-<script src=/resources/testharnessreport.js></script>
-<link rel=help href=https://html.spec.whatwg.org/multipage/rendering.html#button-layout>
-<!--
-If the element is absolutely positioned, then for the purpose of the CSS visual formatting model, act as if the element is a replaced element.  [CSS]
--->
-<link rel=help href=https://drafts.csswg.org/css2/visudet.html#abs-replaced-width>
-<!--
-If at this point the values are over-constrained, ignore the value for either 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value.
--->
-<style>
-#overconstrained { position: absolute; left: 100px; right: 100px; }
-#ltr { position: absolute; left: 100px; margin-top: 2em }
-#rtl { position: absolute; right: 100px; margin-top: 2em }
-</style>
-<button id=overconstrained>test</button>
-<button id=ltr>test</button>
-<button id=rtl>test</button>
-<script>
-for (const dir of ['rtl', 'ltr']) {
-  test(() => {
-    document.documentElement.dir = dir;
-    const overconstrained = document.getElementById('overconstrained');
-    const ref = document.getElementById(dir);
-    assert_equals(overconstrained.offsetLeft, ref.offsetLeft, 'offsetLeft');
-    assert_equals(overconstrained.clientWidth, ref.clientWidth, 'clientWidth');
-  }, `${document.title} (${dir})`);
-}
-</script>
