0

htmlのdivタグにばかげた問題があります（私は思います...）。

背景の相対画像を左上隅に配置し、半分の画像をコンテナの外側に配置します。

問題は、コンテナがそのすべてのコンテンツを満たしていないことです。「オーバーフロー：自動」プロパティを使用しようとしましたが、左隅の画像が非表示になります。

私のhtml：

<div class="content">
    content of the page
</div>
<footer id="footer">
    <div class="column" id="footer-izda">
        <span id="logo-sup"> </span>
        <span>conecta con nosotros</span>
        <ul>
            <li class="twitter">outside of box </li>
            <li class="facebook">outside of box</li>
        </ul>
    </div>

    <div class="column" id="footer-dcha">
        <div class="module widget_nav_menu  deepest">Copyright © 2013</div>
    </div>
</footer>

私のCSS：

.content{
    margin-bottom: 2%;  
}

footer{
    background-color: #333333;
    color: #EDEDED;
    padding: 1%;
    display: block;
    /*overflow: auto;*/
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.column #logo-sup{
    background: url('http://formate21.es/wp-content/themes/master/images/footer.png') left top no-repeat;
    width: 26px;
    height: 26px;
    top: -25px;
    left: 0;
    float: left;
    position: absolute;
}

#footer-izda {
    float: left;
    width: 50%;
    position: relative;
    text-align: left;
}

私はこれをjsfiddleに書きました：http：//jsfiddle.net/ecXba/10/

なにか提案を？

4

1 に答える 1

2

</footer> タグの直前に以下のコードを挿入します。

<div style="clear:both;"></div>

お役に立てれば！

于 2013-02-07T11:56:51.863 に答える