html - ズーム レベルで変化する div の高さ

Question

私のサイトのホームページには、それぞれ異なる量の要素を含む 2 つの列があります。両方の列の高さを合計すると最大 410 ピクセルになりますが、ブラウザーのズーム レベルによっては、2 つの列の下部が揃わない場合があります。これは Chrome で最も顕著に見られ、Firefox ではまったく表示されません。

問題を解決するためにできることはありますか?

問題のページは、ページの下部にあるhttp://goo.gl/mHU3Aです。

Answer 1

Chromeがこれを行っている理由はわかりませんが（あなたが言ったように、高さは両方とも410pxに等しい）、あなたができる1つの「ハック」は次のコードを（あなたのcssに）追加することです：

.test-home { position: relative; }
.test-home .home-new-tutorial-all {
    position: absolute; /* forces it to sit in a specified position */
    bottom: 0; /* don't worry about a left/right, as all we're concerned with is making it sit at the bottom */
    width: 100%; /* required, otherwise it fits to the text-width only */
}

.home-new-tutorial-allこれにより、ブラウザのズームに関係なく、クラスは強制的に最下部に配置されます。「ScriptingforAfterEffects Pt 2」とこのチュートリアルのリンクの間のマージン/スペースが少し大きくなりますが、このリンクのスタイルが異なるため、意図的なものであると言うことはできません。

申し訳ありませんが、Chromeがおかしな動作をする理由ではありませんが、この修正が適切であることを願っています:)

幸運を！