CSS問題：溢出-y不會出現在嵌套div的div內

處理問題時，溢出-y不會出現在chat_messages div內的inner_messages div中，該div位於chat_big div中。我想在inner_div中創建一個滾動，並且我嘗試使用的技術（描述爲here）似乎不起作用...CSS問題：溢出-y不會出現在嵌套div的div內

在我的情況下是否有任何適當的技術使用？

body { 
 
    height: 100%; 
 
} 
 

 
#chat_big { 
 
    background: #ffffff; 
 
    height: 100%; 
 
} 
 

 
#chat_messages { 
 
    width: 700px; 
 
    float: left; 
 
    height: 550px; 
 
    overflow-x: hidden; 
 
    overflow-y: auto; 
 
    border: 5px solid #01abaa; 
 
} 
 

 
#inner_messages { 
 
    width: 700px; 
 
    height: 550px; 
 
    font-size: 16px; 
 
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; 
 
    font-weight: normal; 
 
    background: #ffffff; 
 
    color: #000000; 
 
} 
 

 
#user_list { 
 
    height: 550px; 
 
    overflow: hidden; 
 
    background: #01abaa; 
 
    color: #ffffff; 
 
    border: 5px solid #fedc3d; 
 
} 
 

 
#chat_text { 
 
    float:left; 
 
    width:50%; 
 
    height:55px; 
 
    border: 5px solid #333; 
 
    resize: none; 
 
}

<div id="chat_big"> 
 
    <div id="chat_messages"> 
 
    <div id="inner_messages"> 
 
    </div> 
 
    </div> 
 
    <div id = "user_list"> 
 
    </div> 
 
    <div> 
 
    <textarea id = "chat_text" name = "chat_text"></textarea> 
 
    <input type = "button" id = "send_message_button" value = "Send Message"/> 
 
    <input type = "button" id = "user_info_button" value = "Show User Info"/> 
 
    <input type = "button" id = "log_out_button" value = "Log Out"/> 
 
    </div> 
 
</div>

來源

2016-11-08 Pawel Wasiliuk

以上的CSS你所寫的內容是正確的，滾動會後550px 裏面添加inner_messages更多內容的div你會得到滾動。

如果你想看到550px之前滾動降低inner_messages和chat_messages

來源

2016-11-08 06:23:58

哦高度，謝謝你，現在它真的有效！ :) –

CSS問題：溢出-y不會出現在嵌套div的div內

回答

相關問題