【実現したいこと】 上の図において、要素1と要素2の下面を揃えたい。 【よく見る方法は...】 ・親要素に「position:relative;」 ・子要素に「position:absolute;」、「bottom:0;」 とすると、左右のdivの高ささえ揃えておけば、下面を合わせられますが、BootstrapなどのCSSフレームワークを使用していたりして、既存のスタイルと干渉してしまう場合に、JavaScript(jQuery)で実現する方法を記載します。 【JavaScriptでの実現方法(考え方)】 上の図において、スクリプトを使用し、「A」、「B」、「C」を高さを取得し、計算により「D」の高さを取得します。 「D」=「A」-「B」-「C」 この「D」を要素2の「margin-top」に追加してあげます。 今回は、レスポンシブ(RWD)に対応するため、ウィンドウの幅を変えた時にも「margin-top」を設定し直す仕様とします。 【実装】 jQuery(document).ready(function() { adjustPosition(); $(window).resize(function () { adjustPosition(); }); function adjustPosition(){ var heightA = $("要素1").outerHeight(); var heightB = $("テキスト部").outerHeight(); var heightC = $("要素2").outerHeight(); var heightD = heightA - heightB - heightC; if (heightD > 0) { $("#要素2").css("margin-top", heightD + "px");...