diff --git a/chrome/content/zotero/elements/editableText.js b/chrome/content/zotero/elements/editableText.js
index 2335c639bb..de9b20c1de 100644
--- a/chrome/content/zotero/elements/editableText.js
+++ b/chrome/content/zotero/elements/editableText.js
@@ -292,6 +292,17 @@
 				if (this.maxLines > 0) {
 					this.style.setProperty("--max-visible-lines", this.maxLines);
 				}
+				
+				// Calculate line-height in ems so we don't need to recalculate if font-size changes
+				// TODO: Revisit once we can use the css 'lh' unit (fx >=120)
+				let { lineHeight, fontSize } = getComputedStyle(this._input);
+				let lineHeightRelative = parseFloat(lineHeight) / parseFloat(fontSize);
+				if (isNaN(lineHeightRelative)) {
+					this.style.setProperty('--line-height', '2ex');
+				}
+				else {
+					this.style.setProperty('--line-height', lineHeightRelative + 'em');
+				}
 			}
 
 			if (this.ariaLabel.length) {
diff --git a/scss/elements/_editableText.scss b/scss/elements/_editableText.scss
index 6dbaba84a7..88a4895d3a 100644
--- a/scss/elements/_editableText.scss
+++ b/scss/elements/_editableText.scss
@@ -59,7 +59,7 @@ editable-text {
 
 	&[max-lines] {
 		&::after, .input {
-			max-height: calc(2ex * var(--max-visible-lines));
+			max-height: calc(var(--line-height) * var(--max-visible-lines));
 			scrollbar-width: auto;
 		}
 		&::after {
@@ -79,7 +79,7 @@ editable-text {
 		// Necessary for consistent padding, even if it's actually an <input>
 		-moz-default-appearance: textarea;
 		
-		min-height: calc(2ex * var(--min-visible-lines));
+		min-height: calc(var(--line-height) * var(--min-visible-lines));
 		margin: 0;
 		border: 1px solid transparent;