Javascript 如何防止引导面板变得比浏览器更大？

我正在构建一个node.js应用程序

HTML

  <div class="row">
    <div class="col-md-10">
      <div class="panel panel-primary">
        <div class="panel-heading">
          <h3 class="panel-title">Chat</h3>
        </div>
        <div class="panel-body">
          <ul id="messages"></ul>
          <form id="chat">
            <div class="input-group">
              <input type="text" class="form-control" id="input" />
              <span class="input-group-btn">
                <button type="button" class="btn btn-primary" id="send">Send</button>
              </span>
            </div>
          </form>
        </div>
      </div>
    </div>
    <div class="col-md-2">
      <div class="panel panel-primary">
        <div class="panel-heading">
          <h3 class="panel-title">Users</h3>
        </div>
        <div class="panel-body">
          <div class="list-group" id="users"></div>
        </div>
      </div>
    </div>
  </div>
</div>

---

M.M.M.M.M.Max Height可能会对您有所帮助。我尝试将它们都设置为

Height:100%

，但没有任何效果。不知道如何停止滚动，因此出现了一个问题。您还没有明确说明应该滚动哪个元素。抱歉。我希望消息在聊天面板中滚动，列表项目（用户）在用户面板中滚动。

.panel {
    height: 100vh;
    max-height: 100vh;
    position: relative;
}
.panel-body {
    overflow: auto;
    position: absolute;
    top: 40px;
    bottom: 15px;
    left: 0;
    right: 0;
}