少し複雑な問題があります。単位line-heightの違いとCSSで設定する必要があります。私の考えは、このコードで設定することですvhpxcalc
line-height: calc(100vh - 100px);
簡単に聞こえますが、うまくいきません。これらの単位を使用した計算が機能しない理由は、CSS Calc Viewport Units Workaround で説明されています。これは、マージンとパディングをハッキングすることでプロパティに対して解決されheightますが、行の高さのプロパティには使用できません。
問題は Chrome、IE、Edge で解決されていることがわかりますが、Firefox でもこれを行う必要があります。Firefox では、開発者ツールに表示されます
プロパティ値が無効です。
何か案が？（JavaScriptは私にとって解決策ではありません）