Consider this test case:

<style>
img { border: solid 1px }
p img { height: 10px }
div img { width: 10px }
</style>
<p><img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='2' width='10'></svg>"></p>
<p><img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='1' width='10'></svg>"></p>
<p><img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='0' width='10'></svg>"></p>
<div>
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='10' width='2'></svg>">
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='10' width='1'></svg>">
<img src="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='10' width='0'></svg>">

Its rendering is interoperable in Firefox 70 and Chromium 78:

Relevant specs:

• https://drafts.csswg.org/css2/visudet.html#inline-replaced-width
• https://drafts.csswg.org/css2/visudet.html#inline-replaced-height
• https://drafts.csswg.org/css-images/#default-sizing
• https://svgwg.org/svg2-draft/coords.html#SizingSVGInCSS

In SVG:

The intrinsic aspect ratio must be calculated using the following algorithm. If the algorithm returns null, then there is no intrinsic aspect ratio.

If the width and height sizing properties on the ‘svg’ element are both absolute values:

return width / height

So I would expect the respective intrinsic ratios for those six img elements to be 5, 10, infinity, 0.2, 0.1, and zero.

Each img has has one of or width or height set to a 10px, and the other has its initial value auto. Given this and the presence of an intrinsic ratio, both CSS 2 and css-images specify that the auto dimension should be resolved based on the non-auto one and intrinsic ratio. So I would expect the respective missing sizes to be 50px, 100px, infinity, 50px, 100px, and infinity. With infinities possibly clamped to some large finite value.

This is what happens, except for images 3 and 6. Instead, both browsers seem to behave is if they did not have an intrinsic ratio, taking the missing dimension from their intrinsic size:

In css-images:

If the specified size is only a width or height (but not both) then the concrete object size is given that specified width or height. The other dimension is calculated as follows:

1. If the object has an intrinsic aspect ratio, the missing dimension of the concrete object size is calculated using the intrinsic aspect ratio and the present dimension.

2. Otherwise, if the missing dimension is present in the object’s intrinsic dimensions, the missing dimension is taken from the object’s intrinsic dimensions.

CSS 2 is organized differently but is effectively equivalent to the above as far as I can tell.

Should css-images specify an intrinsic ratio of zero or infinity must be treated as missing?