如何使列使用CSS獨立滾動？

這是我在這裏的第一篇文章（我對這一切都很陌生），但我希望我正確地問它。如何使列使用CSS獨立滾動？

我創造了我的碩士論文的網頁，我需要有文本的三個平行列，將獨立滾動對方，就像this template

我似乎無法從該模板獲得CSS在我的網站上工作，我想知道我做錯了什麼，或者是否有更好的方法來實現這種效果。

非常感謝您的幫助！

這裏是我的CSS my website

body { 
    padding:0;   
    width:100%; 
    height: 100%; 
    max-height: 100%; 
    overflow; hidden; 
    margin: 0; 
    border: 0; 
    background:#FFFFFF;  
    } 

#title { 

    margin-bottom: 5px; 
    background: #fff; 
    width:100% 
    z-index: 20; 
    width: 100%; 
    padding-top: 30px; 
    } 

#title h1 { 

    font-family: Sorts Mill Goudy, Garamound, serif; 
    font-size: 50px; 
    text-align: center; 
    font-weight: 100; 
    color: 696969; 
    line-height: 1px; 
    letter-spacing: 10px; 
    margin-top: 20px; 
    } 



#title h2 { 
    font-size: 16px; 
    font-family: Sorts Mill Goudy, serif; 
    text-align: center; 
    font-weight: 100; 
    color: #999; 
    line-height: 20px; 
    letter-spacing: 0px; 
    } 


#title ul {text-align:center; 
    padding-left, padding-right: 10px; 
    padding-top: 30px; 
    } 

#title ul li { 
    display:inline; 
    font-family: "gill sans mt", "sans-serif"; 
    text-align: center; 
    list-style:none; 
    margin-left:0px; 
    padding-left: 30px; 
    padding-right: 30px; 
    } 

#title p{ 
    font-family: Sorts Mill Goudy Italic, Garamound, serif; 
    size: 14px; 
    font-weight: 300; 
    background: #eee; 
    padding: 10px; 
    margin-left: 80px; 
    margin-right: 80px; 
    margin-top: 20px; 
    margin-bottom: 15px; 
    text-decoration: none; 
    color: #000; 
    } 


#title a { 
    color:#000; 
    text-decoration: none; 
    text-decoration: underline; 
    } 

#title a:hover { 
    color: #A9A9A9; 
    text-decoration: underline; 
    } 

/* column settings */ 

#allcol { 
    position: relative; 
    } 

#allcol h4{ 
    text-align: center; 
    } 

#col1 { 
     font-family: Sorts Mill Goudy, Garamound, serif; 
     text-align: left; 
     float:left; 
     background:#DCDCDC; 
     padding-bottom:10px; 
     padding-top: 10px; 
     padding-left:1.5%; 
     padding-right:1.5%; 
     margin-left: 0px; 
     width:30%; 
     overflow: scroll; 
     } 

#col2 {  font-family: Sorts Mill Goudy, Garamound, serif; 
     text-align: left; 
     background: #fff; 
     float:left; 
     padding-bottom:10px; 
     padding-top: 10px; 
     padding-left:1.5%; 
     padding-right:1.5%; 
     width:30%; 
     overflow: scroll; 
     } 

#col3 { font-family: Sorts Mill Goudy, Garamound, serif; 
     text-align: left; 
     float:left; 
     background:#DCDCDC; 
     padding-left:1.5%; 
     padding-right:1.5%; 
     padding-bottom:10px; 
     padding-top: 10px; 
     width:30%; 
     overflow: scroll; 
     } 

#footer { 
    clear:both; 
    float:left; 
    width:100%; 
    border-top:1px solid #000; 
    }

來源

2013-04-16 BaB

如果您希望滾動條出現，您將不得不設置「高度」。 – CBroe

'http：// capstone.bethanybradshaw.com/Desktop/php/capstonecss.css'和'http：//capstone.bethanybradshaw.com/ Downloads/css.css'都返回404錯誤。 – Mooseman

在此處使用此示例：http://jsfiddle.net/bYXRT/。這正是你所追求的。 – otinanai