0

親 div (コンテンツを含む) の上に子 div を配置しようとしています。

<div id="footer">
  <div id="footer-container">
    <div id="icon"></div>                    
  </div>    
</div>​

#footer {
    height:50px;
    border-top:3px #666 solid;
    margin-top:50px;
}

#footer-container {
    height: 30px;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -15px;   
}

#icon {
    height:30px;
    width:30px;
    background-color:#666;

}​

コンテンツ<div id="icon">がテキストの場合は機能しますが、背景画像を div に配置すると機能しません。これを機能させる方法はありますか？これはおそらくそれをよりよく説明しています http://jsfiddle.net/4QxL7/

編集 お詫び申し上げます。それはずっと働いていました。真ん中に「空白」があり、親divの境界線（同じ色）が子の上を越えているように見える画像にPNGを使用していましたが、実際にはそうです後ろに行く。

ご協力いただきありがとうございます

4

2 に答える 2

1

私は2つの方法を試しましたが、どちらも私のサイトの特大の画像を使用して機能しました...

<div id="footer">
        <div id="footer-container">
            <div id="icon"><img src="image url here" width=30 height=30/></div>                    
        </div>    
    </div>​

http://jsfiddle.net/ZkxSM/

と

#icon {
    height:30px;
    width:30px;
    background-color:#666; /*unnecessary now probably...*/
    background:url('image url here');
}​

http://jsfiddle.net/b6QyX/ (これを機能させるには、事前に画像のサイズを変更する必要があります...または、divのhtmlで幅と高さを設定できます)

あなたのjsfiddleには実際には何も問題はありません..

于 2012-09-27T21:36:48.817 に答える
0

申し訳ありません。それはずっと働いていました。真ん中に「空白」があり、親divの境界線（同じ色）が子の上を越えているように見える画像にPNGを使用していましたが、実際にはそうです後ろに行く。

ご協力いただきありがとうございます

于 2012-09-27T21:45:21.380 に答える