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

This commit is contained in:
Michael Arthur 2021-09-20 19:40:23 +12:00
parent eeda86bd5e
commit d877734168
2 changed files with 8 additions and 0 deletions

View File

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

View File

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