왜 상단과 중간 slicings에 간격이 있습니다

Question

나는이 2 페이지

http://slacklog.heroku.com/ 
http://slacklog.heroku.com/signup/date 

Na로 위에서 볼 수 있듯이 상단 및 중간 및 하단과 중간 이미지 간의 갭이 있습니다 ....

여기 내 html

<div class="content" align="center"> 
<div class="slacklog_log"></div> 
<div class="main_column_section"> 
    <div class="wide_box_top"></div> 
    <div class="wide_box_body" id="main_content_body"> 
     <div id="white"> 
      <div class="wide_box_top_white"></div> 
      <div class="wide_box_body_white"> 
      <!-- unique per page --> 
      <!-- stuff --> 
      </div> 
      <div class="wide_box_bottom_white"></div> 
     </div> 
    </div>   
    <div class="wide_box_bottom"></div> 
</div> 
</div><!--content--> 

입니다.

다른 도움이 필요하시면 저를 도울 수 있습니다 .... BTW. 나는 패딩이나 마진을 찾았고, 파이어 버그에서 그것을 전혀 보지 못했다 ... 미리 감사드립니다.

Answer 1

.content 확인하지 않았다 믿는다

#white { 
    width: 650px; 
    margin: 0 auto; 
} 

.wide_box_top_white { 
    background: url("/images/white_top.png") no-repeat scroll 0 0 transparent; 
    height: 9px; 
    float: left; 
    width: 650px; 
    display: block; 
} 

.wide_box_body_white { 
    background: url("/images/white_middle.png") repeat-y scroll 0 0 transparent; 
    float: left; 
    width: 650px; 
    display: block; 
} 

.wide_box_bottom_white { 
    background: url("/images/white_bottom.png") no-repeat scroll 0 0 transparent; 
    height: 10px; 
    float: left; 
    display: block; 
    width: 650px; 
} 

을

추가 된 스타일을 모두 필요로하지는 않지만 피해를주지는 않습니다. 나는 주로 추가 한 플로트 : 왼쪽, 폭 :는 650 및 디스플레이 : 블록 #white div의 내부 클래스에 .... 훨씬 더 당신이 일반적인 구조를 개선 할 수있다

. 예를 들어, .wide_box_body_white 클래스에서 수행하는 것처럼 이미지를 사용하여 흰색 배경을 적용하라는 조언은 실제로하지 마십시오. .wide_box_bottom_white 및 .wide_box_top_white 클래스를 없애고 .wide_box_body_white에 테두리 반경을 지정하는 것이 좋습니다. stephenmurdoch에 의해 제안 ...

Answer 2

여백 속성을 재설정하지 않았기 때문입니다. 상단 h1 날짜/h1에 여백 - 위쪽 세트가 있고 하단에는 마진 - 아래 세트가있는 p 종료 날짜/p가 있습니다. 0으로 설정하면 작동합니다.

당신은 당신이 불을 지르고에서이를 확인했다고 말했다,하지만 난 당신이 H1과 P : 나는 다음과 같은 스타일을 적용하여 그것을 해결하기 위해 관리했습니다

Answer 3

, 당신은 wide_box_top_white, wide_box_body_white에서 이미지를 제거하고 wide_box_bottom_white하고 #white div의

#white { 
    background-color: white; 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    -ms-box-sizing: border-box; 
    box-sizing: border-box; 
    -moz-border-radius: 12px; 
    -webkit-border-radius: 12px; 
    -o-border-radius: 12px; 
    -ms-border-radius: 12px; 
    -khtml-border-radius: 12px; 
    -moz-box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2), 0 0 2px rgba(0, 0, 0, 0.3); 
    -webkit-box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2), 0 0 2px rgba(0, 0, 0, 0.3); 
    -o-box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2), 0 0 2px rgba(0, 0, 0, 0.3); 
    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2), 0 0 2px rgba(0, 0, 0, 0.3); 
}