2013-07-10 9 views
0

내 웹 사이트의 가로 시차 스크롤을 작성하려고합니다. 그러나 슬라이드의 시작 부분과 홈 페이지의 텍스트가 시작되는 부분 사이에 커다란 차이가 생깁니다. 패딩 0, 여백 0, 모든 쓸데없는 설정 시도했다. 어떤 아이디어? 여기에 내가 무엇을 의미하는지 설명하기 위해 스크린 샷입니다 : http://i.imgur.com/l9AcKf2.jpg슬라이드 시작 부분과 홈 페이지 사이의 큰 차이

HTML :

<div id="transition-slide-container"> 
    <div id="transition-slide"> 
    <div id="inner-container> 
    <div class="slide" id="home"> 
     <h1>home</h1> 
    </div> 
    </div> 
    <div class="slide" id="portfolio"> 
     <div id="inner-container"> 
     <h1>portfolio</h1> 
     </div> 
    </div> 
    <div class="slide" id="about"> 
     <div id="inner-container"> 
     <p>about</p> 
     </div> 
    </div>     
    <div class="slide" id="contact"> 
     <div id="inner-container"> 
     <p>contact<p> 
     </div> 
    </div> 
</div> 

CSS :

div#transition-slide-container {  
    background: #bee1ff;  
    padding-top: 128px; 
    padding-bottom: 50px; 
    height: 900px; 
    min-width: 400%;  
    z-index: -1; 
    float: left; 
    position: relative; 
} 
div#transition-slide { 
    white-space: nowrap; 
} 
.slide { 
    display: inline-block; 
    width: 1620px; 
    margin: 0 auto; 
} 
div#inner-container { 
    width: 1024px; 
    margin: 0 auto; 
    padding: 0; 
} 

웹 사이트 : andrewgu12.kodingen.com

감사합니다!

답변

0

추가하면 플로트 : 헤더 클래스에 남아, 그것은

div#header { 
color: #FFFFFF; 
float: left; 
margin: 0 auto; 
padding: 0; 
position: relative; 
top: 0; 
width: 960px; 

}

+0

내가 밝은 파란색 영역 내 메뉴 바없는 몸의 텍스트를 참조하고 해결합니다. 내 질문에 명확하게 말하지 않았으므로 나는 의미하는 바를 스크린 샷에 추가 할 것이다. – Andrew