<!DOCTYPE html>
<div style="width: 0; height: 0">
<div style="width: -moz-available; width: -webkit-fill-available; width: stretch;
min-width: -moz-available; min-width: -webkit-fill-available; min-width: stretch;
height: -moz-available; height: -webkit-fill-available; height: stretch;
min-height: -moz-available; min-height: -webkit-fill-available; min-height: stretch;
margin: 10px; border: 10px solid; padding: 10px"></div>
</div>
<script>
var el = document.querySelector("div > div");
document.body.prepend(el.clientWidth + " x " + el.clientHeight);
</script>https://drafts.csswg.org/css-sizing-4/#stretch-fit-sizing
Formally, its behavior is the same as specifying an automatic size together with a self-alignment property value of stretch
This seems to imply a non-negative content size, but...
Additionally, [...] a stretch-fit size causes the box to attempt to fill its containing block—behaving as 100% but applying the resulting size to its margin box instead of the box indicated by box-sizing
This doesn't seem to imply a non-negative content size. We might guess so because box-sizing: border-box avoids negative content sizes, but it's not stated.
https://drafts.csswg.org/css-sizing-4/#stretch-fit-sizing
This seems to imply a non-negative content size, but...
This doesn't seem to imply a non-negative content size. We might guess so because
box-sizing: border-boxavoids negative content sizes, but it's not stated.