1
I 사이트에서 탐색 메뉴에 고정 된 헤더가 있습니다고정 헤더 및 창 크기를 조정
<div id="header_wrapper">
<div class="inner_content">
<div class="control_wrapper">
<div class="control local">
<a class="white_font" id="link_user_experience">USER EXPERIENCE</a>
</div>
<div class="control local">
<a class="white_font" id="link_restocking">RESTOCKING EXPERIENCE</a>
</div>
<div class="control local">
<a class="white_font" id="link_analytics">ANALYTICS</a>
</div>
<div class="control">
<a class="white_font" id="link_team" href="team">TEAM</a>
</div>
</div>
</div>
문제가 있다는 것입니다 : 여기
#header_wrapper
{
height: 75px;
background-color: #FD735B;
z-index: 999;
position: fixed;
width: 100%;
}
#header_wrapper .control_wrapper
{
position: absolute;
right: 0px;
}
#header_wrapper .control_wrapper .control
{
float: left;
padding-left: 35px;
padding-top: 25px;
font-weight: bold;
}
.inner_content
{
height: 100%;
margin: 0px auto;
width: 85%;
position: relative;
z-index: 1;
}
헤더의 HTML입니다 창 크기를 조정하고 탐색 메뉴의 좁은 부분을 잘라내면 그리고 가로로 스크롤하려고하면 잘립니다. 여기
은 잘라 헤더의 이미지입니다 :
내가 오른쪽으로 스크롤하기 위해 노력하고있어 - 내용이 스크롤되어 있지만 헤더는 동일하게 유지 :
크기를 조정 한 후에 헤더를 어떻게 보이게 할 수 있습니까?
업데이트 :
나는 jsfiddle에 내 문제를 다시 시도했다. 좁은 창을 모방하기 위해 페이지와 머리글에 큰 너비를 설정했습니다 (내 문제는 사용자가 창 크기를 조정할 때만 나타납니다).
헤더에 3 개의 제목을 넣었습니다. 바이올린을로드하면 2 개만 표시됩니다. 세 번째 것은 볼 수없는 영역입니다. 나는 당신이 단지 수평으로 스크롤해야한다고 생각했고 고정 헤더는 나머지 페이지와 함께 스크롤 할 것입니다. 그러나 고정 헤더가 스크롤되지 않으며 제목 # 3을 볼 수 없습니다.
즉, 다른 요소처럼 가로로 스크롤하려면 고정 머리글이 필요합니다.
문제를 더 잘 보시려면 codepen이나 jsfiddle을 제공해 주시겠습니까? –
@jonathan이 jsfiddle example.I을 추가하여 스크롤에 대한 내 문제를 나타내기를 바랍니다. – Tamara