The grey boxes below are <svg>
elements.
All SVGs in each row should have the exact same size.
Each row has its own viewBox width and height: viewBox="0 0 width height"
.
Each column has its own width/height styling. For example, style="width: 200px; height: auto;"
.
The first column has both an explicit widht and an explicit height, so there's not much that can go wrong there. It acts as a reference.
The first row has integer viewBox width and height. Firefox then sizes all SVGs correctly.
The remaining rows have at least one non-integer viewBox width and height. Firefox then sizes the SVGs a bit wrong.
Chrome, Safari and Edge seem to pass all tests.