溢出-y滾動不適用於嵌套在div中的ul

必須有一些特殊要求才能使overflow-y: scroll正常工作，並且我無法找到它......任何想法？溢出-y滾動不適用於嵌套在div中的ul

HTML：

<div> 
    <ul> 
    <li> 
     One 
    </li> 
    <li> 
     One 
    </li> 
    <li> 
     One 
    </li> 
    <li> 
     One 
    </li> 
    <li> 
     One 
    </li> 
    <li> 
     One 
    </li> 
    <li> 
     One 
    </li> 
    </ul> 
</div>

CSS：

div { 
    background-color: #FFFFEE; 
    width: 200px; 
    height: 100px; 
    overflow-y: hidden; 
} 

ul { 
    overflow-y:scroll; 
}

來源

2017-08-04 JacobIRR

爲什麼你不希望添加'溢出-Y：scroll'爲'div'，而不是'ul'？ –

@CommercialSuicide - 因爲這使得整個div向下滾動，而不僅僅是UL – JacobIRR

你可以將'ul'包裝在輔助'div'中並設置爲滾動條。 –

從div容器元素中移除overflow-y：hidden。

爲ul添加一個明確的高度。

div { 
    background-color:#FFFFEE; 
    width: 200px; 
    height: 100px; 
    //overflow-y: hidden; 
} 

ul { 
    height: 100px; 
    overflow-y:scroll; 
}

應該這樣做。

來源

2017-08-04 23:34:58 eulloa

根據OP的評論，看起來他們只是想讓UL滾動，而不是整個div。這個答案是OP所要求的，並且應該被標記爲正確的。 –

謝謝，定義「高度」似乎有訣竅 – JacobIRR

更改DIV溢出-Y滾動和去除UL造型爲我工作：

div { 
    background-color:#FFFFEE; 
    width: 200px; 
    height: 100px; 
    overflow-y: scroll; 
} 

/* you don't need this. 
ul { 
    overflow-y:scroll; 
} 
*/

編輯：根據OP的評論，只有UL應滾動。 This答案完成了。我的回答將滾動div的全部內容。

來源

2017-08-04 23:34:38

編輯UL CSS來：

ul { 
    margin: auto; 
    height: 100px; 
    overflow-y:scroll; 
    }

通過添加「高度」屬性，該屬性等於父元素，以及「餘量」到「汽車」。

https://jsfiddle.net/7j428j5g/

來源

2017-08-04 23:36:23 TalGabay

溢出-y滾動不適用於嵌套在div中的ul

回答

相關問題