고정 된 머리글 및 고정 오른쪽 스크롤바

페이스 북처럼 사용하고 싶은 고정 스크롤 막대 및 고정 오른쪽 스크롤바에서 작업하고 있습니다. 하지만 오른쪽 사이드 div가 고정되지 않도록하고 싶습니다. 나는 고정 된 위치에있다. 이번엔 왼쪽으로 시프트.고정 된 머리글 및 고정 오른쪽 스크롤바

<div class="globalHeader"><div class="globalHader-in"></div></div> 
<div class="global_container"><div class="container"> 
    <div class="ksmsl"></div> 
    <div class="ksmort"></div> 
    <div class="ksmsg"></div> 


</div></div>

과 :

가 나는 그것이 가지고있는 검은 div.Header의 오른쪽에 고정 할 height: 40px;

이 JSfiddle

의 데모이 내 HTML 코드입니다 CSS 코드 :

body{ 
    margin:0px; 
    padding:0px; 

} 
.globalHeader { 
    width:100%; 
    height:40px; 
    position:fixed; 
    background-color:#2a3542; 
    z-index:99999; 
    } 
.globalheader-in { 
    width:981px; 
    height:40px; 
    margin-left:auto; 
    margin-right:auto; 
    border-right:1px solid #fff; 
    border-left:1px solid #fff; 
    } 
.global_container{ 
    clear:both; 
    width:981px; 
    height: 100000px; 
    margin-left:auto; 
    margin-right:auto; 
    overflow:hidden; 
    position:relative; 
    top:40px; 
    background-color:#f8f8f8; 
    } 
.container{ 
    float:left; 
    width:981px; 
    height:auto; 

    } 
.ksmsl{ 
    float:left; 
    width:220px; 
    height:auto; 
    border-radius:5px; 
    -webkit-border-radius:5px; 
    -moz-border-radius:5px; 
    -o-border-radius:5px; 

    } 
.ksmsg{ 
    float:right; 
    width:199px; 
    height:1000px; 

    background-color:#000; 
    } 
.ksmort{ 
    float:left; 
    width:560px; 
    height:auto; 
    border-left:1px solid #d8dbdf; 
    border-right:1px solid #d8dbdf; 
    border-bottom:1px solid #d8dbdf; 
    }

출처

2014-03-13 somebodyknowsme

'.global_container' 클래스를'height : 100000px; '로 만드는 것은 나쁜 습관이라고 말할 수 있습니다. 대신 내용에 높이를 결정하게해야합니다. 그렇지 않으면 당신은 그 높이 (어느 정도 소요됩니다)를 모두 미리로드해야 할 것이며, 충분한 내용을 채울 수 없을 때 나빠질 것입니다. 단지'* {height : 100 %;} '또는 무엇인가를 설정하십시오. – TylerH

@TylerH 이걸 알고 있습니다. 이것은 단지 예일뿐입니다 – somebodyknowsme

당신이 그것을 알고 그것을 사용하지 않는다면 왜 그것을 당신의 모범에 넣을까요? – TylerH

사이드 바를 수정하고 올바르게 떠 다니는 대신 오른쪽 : 0;

.ksmsg{ 
    margin-top: 40px; 
    position: fixed; 
    right: 0; 
    width:199px; 
    height:1000px; 
    color: #fff; 
    background-color:#000; 
    }

JS Fiddle은 컨테이너 내에서 고정 사이드 바 유지에 관해서는, 당신은 고정 사업부를 포함 할 수 없습니다. 다음을 참조하십시오 : Fixed position div not staying contained in wrapping div, overlays entire screen?

출처

2014-03-13 14:36:29

답장하지만 내 컨테이너 너비는 981px 만 내 CSS에서 .ksmsg가 있어야하는 곳이 아님 – somebodyknowsme

내 예제를 업데이트 할 수 있는지 확인합니다. 확인 만 할 수 있습니다. 이 튜토리얼은 자바 스크립트를 사용했지만 .ksmsg div normaly 오른쪽 측면 그래서 내가 말할 때 위치 : 절대 왼쪽으로 갈 것입니다. 고정 괜찮지 만 위치 확인되지 않습니다. http://jsfiddle.net/mustafaozturk74/g3p2U/6/ – somebodyknowsme

고정 div를 포함 할 수 없습니다. http://stackoverflow.com/questions/5146971/fixed-position-div-not-staying-contained-in-wrapping-div-overlays-entire-screen –

고정 된 머리글 및 고정 오른쪽 스크롤바

답변

관련 문제