스크롤 이미지가 작동하지 않습니다.

Question

다음 코드는 의도 한대로 동작하지 않습니다.

index.html을

#header { 
 
    z-index: 2; 
 
    height: 90px; 
 
    width: 100%; 
 
    min-width: 1060px; 
 
} 
 
#footer { 
 
    position: absolute; 
 
    z-index: 2; 
 
} 
 
#top-wrapper { 
 
    overflow-x: auto; 
 
} 
 
#main-content { 
 
    min-width: 1060px; 
 
    position: absolute; 
 
    overflow-y: auto; 
 
} 
 
#image-wrapper { 
 
    padding-left: 20%; 
 
    padding-right: 20%; 
 
    width: 100%; 
 
    height: 500px; 
 
} 
 
#coordinations { 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 500px; 
 
}

<div id="top-wrapper"> 
 
    <div id="header"> 
 
    <!-- some nav menu --> 
 
    </div> 
 
    <div id="main-content"> 
 
    <div id="image-wrapper"></div> 
 
    <div id="coordinations"></div> 
 
    </div> 
 
    <div id="footer"> 
 
    <!-- some footer note --> 
 
    </div> 
 
</div>

문제는 여기에 내 스크롤 내가 영으로 그것을 만들 수 없다거나 가지고 있기 때문에 (없애 보이지 않는 #coordination의 사업부를 가지고있다 # 이미지 래퍼 div에서 사용해야하는 모든 좌표).

상단의 주 콘텐츠 div에 보이지 않는 div를 만들려고 했으므로 overflow-y를 사용하지만 작동하지 않습니다. 나는 더 큰 div 안에 main-content를 포함하고, x 값에 min-height를 넣으려고했다. 여전히 작동하지 않습니다.

#coordinations의 보이지 않는 콘텐츠없이 # 이미지 래퍼를 만들 수있는 가능한 모든 방법은 무엇입니까?

업데이트

#coordinations 
{ 
position:relative; 
width:100%; 
height:0px; 
} 

나는이를 볼 수 있지만, 0 픽셀에 비해 높이로 위치를 변경하여하지 않았다 죄송합니다. # 코디네이션 포인트 또는 코디네이션의 하위 항목은 영향을받지 않습니다.

는 당신의 도움을 주셔서 감사합니다.

Answer 1

#coordinations을 display: absolute으로 설정 했으므로 left: -9999px;과 함께 화면을 이동하지 않는 이유는 무엇입니까?