html - 如何将侧边栏扩展到页面底部？

Question

我在 http://www.csgodrift.com/ 上的侧边栏遇到了一些问题 |

基本上，我希望用户可以输入聊天消息的 .divchatfooter 固定在屏幕底部，当用户缩小时它保持固定但 .divchat 高度会拉伸(stretch)。

此外，当用户输入聊天消息时，聊天区域的高度不会保持固定，而是会扩展，而不是让消息在该区域内滚动。

我认为如果您登录(如果您有 Steam)并检查元素，那么测试这个最简单，但如果您愿意，我已将代码包含在 jsfiddle 中。 https://jsfiddle.net/hwxsvqa5/ jsfiddle

有什么想法吗？

Answer 1

这可能有效每次将数据放入聊天时，高度都应该增加。但您可能需要设置一个 max-height 限制。

#divchatfooter {
  background-color: #1A1C26;
  padding-bottom: 5px;

  /*ADD THIS CODE*/
  position: fixed;
  bottom: 0;
  left: 0;
  width: inherit;
}

这应该可以解决宽度问题。主要元素的右侧有填充。所以 width:inherit; 取主元素的宽度 + 内边距。如果您更改此代码，它会使侧边栏中的所有宽度都相同，但是，它会使您的侧边栏变长几个像素。

从 .mainsidebar { padding-left: 0px; 改变它}

以下内容

.mainsidebar {
  padding: 0px;
}