2013-02-07 7 views
0

HTML 태그로 div 태그를 사용하면 바보 같은 문제가 있습니다.div 외부 오버플로 img

왼쪽 위 모서리에 배경 이미지를 배치하고 그 반쪽 이미지를 컨테이너 외부에 배치하려고합니다.

문제는 컨테이너가 모든 콘텐츠를 채우지 않는다는 점입니다. "overflow : auto"속성을 사용하려고하지만 왼쪽 모서리 이미지가 숨겨집니다.

내 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 : http://jsfiddle.net/ecXba/10/

어떤 제안 :

.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에 쓴?

답변

2

</footer > 태그 바로 앞에 코드를 삽입하십시오. 이 도움이

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

희망!

+0

Ouyea !!!!! 정말 고맙습니다! – MrViSiOn