css질문입니다~
본문
<style type="text/css">
#footer{width:100%; height:80px; background-color:red;position:relative;}
.footer{width:1280px; margin:0 auto;position:relative;}
.footer:after{content:"";display:block;clear:both;}
.foot_left{width:480px;float:left;}
.foot_right{width:800px;float:left;}
*{margin:0; padding:0;}
</style>
<div id="footer">
<div class="footer">
<div class="foot_left">푸터 레프트</div>
<div class="foot_right">푸터 라이트</div>
</div>
</div>
이렇게 할경우에 그냥 보기엔 제대로 보이지만
브라우저의 크기를 좁힐경우 사진처럼 오른쪽에 여백이 생깁니다.
최상위 #footer의 width값을 100%로 주고 자식 .footer의 width값을 1280px에 margin:0 auto;로 주었는데..
이렇게 하면 안되나요..?
#footer와 .footer를 부모 자식관계로 하지 말고 따로 떨어트려야 하나요..?
답변 2
overflow:hidden;
한번 줘보세요.
감사합니다~~^ ^
<style type="text/css">
.footer{width:100%; height:80px; width:1280px; margin:0 auto;position:relative;overflow:hidden; border:1px solid blue;}
.foot_left{width:478px; height:78px; float:left; border:1px solid brown;}
.foot_right{width:798px; height:78px; float:left; border:1px solid magenta;}
</style>
<div class="footer">
<div class="foot_left">푸터 레프트</div>
<div class="foot_right">푸터 라이트</div>
</div>
감사합니다~~^ ^
답변을 작성하시기 전에 로그인 해주세요.
