Jak naprawić pasek boczny i nagłówek za pomocą CSS dla JS i jQuery Scroller

Question

Mam ten układ i chcę, aby lewy pasek boczny, prawy pasek boczny i nagłówek stały.

To jest mój css:

#container { 
     padding-left: 200px;  /* LC fullwidth */ 
     padding-right: 190px;  /* RC fullwidth + CC padding */ 
    } 

    #container .column { 
     position: relative; 
     float: left; 
    } 

    #center { 
     padding: 10px 20px;  /* CC padding */ 
     width: 100%; 
     overflow-x:hidden; 
    } 

    #left { 
     width: 180px;    /* LC width */ 
     padding: 0 10px;   /* LC padding */ 
     right: 240px;    /* LC fullwidth + CC padding */ 
     margin-left: -100%; 
    } 

    #right { 
     width: 130px;    /* RC width */ 
     padding: 0 10px;   /* RC padding */ 
     margin-right: -100%; 
    } 

    #footer { 
     clear: both; 
    } 

& kod jest here

Po tym kroku, chcę dodać nanScrollerJS na prawym pasku bocznym.

nie jestem zaznajomiony z CSS

Answer 1

Czy to właśnie próbowaliście zrobić?

Fiddle

Mam usunięte prawie cały swój kod i zastąpić go nowym kodem.

# stałe

position: fixed; 
top: 0; 
left: 0; 
width: 100%; 

# środkowy

margin-top: 32px; /* Header height */ 
padding: 10px 20px; /* CC padding */ 
box-sizing: border-box; 
border-left: 200px solid black; /* LC width including padding */ 
border-right: 150px solid black; /* RC width including padding */ 

# lewo

width: 180px; /* LC width */ 
padding: 0 10px; /* LC padding */ 
float: left; 

# prawo

width: 130px; /* RC width */ 
padding: 0 10px; /* RC padding */ 
float: right; 

# stopka

position: relative; 
z-index: 1; 

Answer 2

Można użyć position:fixed, ale, oczywiście, dla IE trzeba pewne hacki, aby to działało.

Answer 3

Zawsze można po prostu naprawić środek z absolutną wysokością, a następnie przepełnieniem -y. Oto przykład tego, co mam na myśli:

#center { 
     padding: 10px 20px;  /* CC padding */ 
     width: 100%; 
     height: 240px;    
     overflow-y:scroll;   
     overflow-x:hidden; 
    } 

i oto przykład roboczych (na podstawie twoich): http://jsfiddle.net/nr2NZ/27/

Technicznie przykład na nanScrollerJS używa stałego div na zewnątrz, jednak w tym przypadku, może dlatego, że jeśli pola zewnętrzne są względne w stosunku do pozycji, tzn. nie powinny teoretycznie mieć problemu.