컨테이너 사업부 여분의 여백 6으로

<div id="container"> 
    <div id="content"> 
     <div class="halfLeft"></div> 
     <div class="halfRight"></div> 
    </div> 
</div> 

#container{ width:960px;margin:auto; background-image:url(../img/contentbg.jpg);} 
.halfLeft{font: 1.5em BrushcutRegular; background:url(../img/halfbg.png) no-repeat;margin:12px 0px 12px 12px;float:left;width:468px;height:336px;} 
.halfRight{font: 1.5em BrushcutRegular; background:url(../img/halfbg.png) no-repeat;margin:12px 12px 12px 0px;float:right;width:468px;height:336px;}

이 ... #container는 IE6에서 왼쪽에 추가로 12 픽셀을 추가 할 수 있습니다컨테이너 사업부 여분의 여백 6으로

무슨 일이야 어떤 아이디어?

출처

2011-07-02 Zaphod Beeblebrox

문제가 해결 될 때까지 CSS 속성을 제거해 보셨습니까? 또한 일반적으로 왼쪽 및 오른쪽 div를 모두 떠 다니는 것이 더 직관적 인 것처럼 보이지만 더 나은 방법입니다. –

난 당신이 #content 몇 가지 스타일을 추가한다고 생각합니다.

출처

2011-07-02 16:30:48 Vladimir

공지 사항 : 이전에 #content에 어떤 스타일을 적용했는지 모르겠으므로주의하십시오. #content {}에 '너비'가 있으면 값을 수정해야합니다. 예를 들어 패딩 때문에 #content {width : 960px}가 #content {width : 936px}가되어야합니다. – Vladimir

.halfLeft과 .halfRight에 모두 display: inline;을 추가하십시오.

추가 정보 :

padding: 12px; 
overflow: hidden; /* Floating fix for modern browsers */ 
zoom: 1; /* Floating fix for IE */

을 그리고 .halfLeft 및 .halfRight에서 마진을 제거 : The IE5/6 Doubled Float-Margin Bug

출처

2011-07-02 14:55:21

컨테이너 사업부 여분의 여백 6으로

답변

관련 문제