see pr niklasvh#2708

Squashed commit of the following:

commit d877734
Author: Michael Arthur <michael.arthur@propellerhead.co.nz>
Date:   Mon Sep 20 19:40:23 2021 +1200

    set container and a few other styles so existing css styles dont conflict causing baseline calculation to be wrong

src/render/font-metrics.ts

@@ -28,21 +28,28 @@ export class FontMetrics {
         container.style.margin = '0';
         container.style.padding = '0';
         container.style.whiteSpace = 'nowrap';
+        container.style.position = 'absolute';
+        container.style.top = '-1000px';
 
         body.appendChild(container);
 
         img.src = SMALL_IMAGE;
         img.width = 1;
         img.height = 1;
+        img.style.width = '1px';
+        img.style.height = '1px';
 
         img.style.margin = '0';
         img.style.padding = '0';
         img.style.verticalAlign = 'baseline';
+        img.style.display = 'inline-block';
 
         span.style.fontFamily = fontFamily;
         span.style.fontSize = fontSize;
         span.style.margin = '0';
         span.style.padding = '0';
+        span.style.lineHeight = 'normal';
+        span.style.height = 'auto';
 
         span.appendChild(this._document.createTextNode(SAMPLE_TEXT));
         container.appendChild(span);

tests/reftests/text/text.html

@@ -7,6 +7,7 @@
     <style>
         body {
             font-family: Arial;
+            display: flex;
         }
 
         .small {