Jquery 在HTML5中的expan/collapse of details标记上动态更改div高度

我在一个容器中有一组细节标签，其高度是动态设置的，以适应屏幕大小。每当我展开details标记，并且内容高度大于screen时，都不会应用容器样式。为了更好地理解，我附上了一个屏幕截图：

---

在设置“所有样式的高度第一”属性没有等号（“=”）后，您可以添加

px

。此外，倒数第二个

标记未关闭。请修复并将示例更改为代码段。我试图复制，但整个页面是蓝色的，所以我不确定错误在哪里。

<div class="container" style"background-color:blue;">
<details>
  <summary>Copyright 1999-2014.</summary>
  <p> - by Refsnes Data. All Rights Reserved.</p>
  <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>
<details>
  <summary>Copyright 1999-2014.</summary>
 .............................
</details>
<details>
  <summary>Copyright 1999-2014.</summary>
  .............................
</details>
<details>
  <summary>Copyright 1999-2014.</summary>
  .............................
<details>
  <summary>Copyright 1999-2014.</summary>
  .............................
</details>
</div>

$(document).ready(function () {
    $('.container').css('height', $(window).height());
        // Comma, not colon ----^
    }
);

$(window).resize(function () {
    $('.container').css('height', $(window).height());
    // Comma, not colon ----^
});