Question

处理问题时，overflow-y不会出现在inner_messages div中，该div位于chat_messages div中，该div位于chat_big div中。我想在inner_div中创建一个滚动，我尝试使用的技术（描述为here）似乎不起作用......

我的情况下是否有适当的技巧？

＆＃13;

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;
}

＆＃13;

<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>

＆＃13;

Answer 1

上面提到的css是正确的，滚动将在550px后出现在inner_messages div中添加更多内容，您将获得滚动。

如果您希望在550px之前看到滚动，请降低inner_messages和chat_messages的高度

CSS问题：overflow-y不会出现在嵌套div中的div内部

1 个答案: