CSS是一个问题。元素本身指定一个值

我有以下调用chat的代码：

<div id="chatContainer">
  <span id="chatClose" class="chat-close"></span>
  <div id="chatHeader" >Chat</div>
  <p style="font-size: 15px;padding: 8px;color:white;">
    <b>
      <img src="frontend/chat/img/Chat.png" style="width: 36px;" />
      Chat
    </b>
  </p>
  <div id="chatScroll" style="overflow-y: scroll;">
    <div id="messages"></div>
  </div>
</div>

我检查了CSS冲突并重新检查了像素，没有设置937像素。我尝试更改高度，例如设置700像素：

<div id="chatContainer" style="height: 700px;">

此外，我还尝试在chatContainer中添加高度，这没有帮助。如何解决这个问题

---

UPD:我有一个切换聊天的功能。如果我从JS中删除tooggle，很好，高度就是我键入的。但如果我回到切换函数，当你看到chrome调试工具中的

元素.style

时，所有的函数都会崩溃，这意味着它是一种“内联样式”，通常它们是由脚本自动分配的

这是一种内联样式：

<div style="height: 100px;"></div>

它不起作用的原因是，如果对

div

具有相同的样式级别，并且在不同的位置指定了它，则它们具有不同的优先级。以下是从最“强大”到最不重要的优先事项：

内联样式（使用

style=”“

属性）

嵌入式样式（使用

标记）

链接样式（使用

标记）

---

换句话说，如果所有3个位置的目标都是

。某些div{}

，那么#1将始终覆盖2和3。

当您在chrome调试工具中看到

元素.style

时，这意味着它是一种“内联样式”，通常由脚本自动分配

这是一种内联样式：

<div style="height: 100px;"></div>

它不起作用的原因是，如果对

div

具有相同的样式级别，并且在不同的位置指定了它，则它们具有不同的优先级。以下是从最“强大”到最不重要的优先事项：

内联样式（使用

style=”“

属性）

嵌入式样式（使用

标记）

链接样式（使用

标记）

---

换句话说，如果所有3个位置的目标都是

。某些div{}

，那么#1将始终覆盖2和3。

不，它应该可以正常工作。你确实有冲突的css规则（绝对和固定）等，但它仍然可以正常工作。记住，如果答案对你有帮助，请将其标记为选中，干杯！不，它应该很好用。你确实有冲突的css规则（绝对和固定）等，但它仍然可以正常工作。记住，如果答案对你有帮助，请将其标记为选中，干杯！

<div style="height: 100px;"></div>

#chatContainer {
  height: 700px !important;
}