空のdivに背景を追加する - 高さを指定できない

Question

私は、左上、右上、左下、右下の4つのdivでHTMLレイアウトを作成しました。

例：http://www.arkat-bayern.de/arkat-bayern.html

左上のdivは空です。その幅はCSSのwidthプロパティを使って固定され、その高さは右上のdivの内容によって決まります。左上のdivに背景を設定したい（または、その時点での例に示されているように、高さ：100％のコンテンツをコンテンツとして追加する）。 Former discussionsは、空のdivの高さを指定する必要があるというアドバイスをもたらしますが、私はその解決策を適用できません。

それで、空のdivを隣のdivで決まる高さにするにはどうすればいいですか？

Answer 1

あなたはCSSで背景画像を設定することができますし、それはのように利用可能なスペースをカバーしています

.top-left { 
    background:url('/images/image-name.jpg') no-repeat; 
    background-size:cover; 
    background-position:center; 
} 

これは、限り、あなたは高さが設定されているように動作します。あなたはそれの隣のdivに等しくなるように高さを設定する方法を見つけ出すことができない場合は行うことができますjQueryを使ってそのようなこと：

$(function() {  
    var topRight = $('.top-right').height(); 
    $('.top-left').height(topRight); 
}); 

は、いつものように確認してくださいjQueryの上記のコードをインクルードする前にロードされます。

Answer 2

id = "Titelgrafik"、id = "obenlinks"のdivの場合、マッチ高さjsプラグイン（https://github.com/liabru/jquery-match-height）を使用してみてください。その後、CSSを適用します。

#obenlinks { 
background:url('/images/image-name.jpg') no-repeat center; 
} 

Answer 3

これは私が今、回答に基づいて、それを行う方法です。

<script> 
    $(function() {  
    var topRight = document.getElementById('topright').offsetHeight; 
    document.getElementById('topleft').style.height = topRight + 'px'; 
    }) 
</script>