JQuery .height() 没有按预期工作

Question

我正在制作一个日历网站。在这里，我有一个日历 div，其中加载了日历，包裹在一个内容 div 中。 在此页眉和页脚位置固定。日历在蓝色部分加载。

HTML

<div class ="content">
   <div id="calendar"></div>
</div>

CSS

.content{
   background: #fcfcfc;
   height: 100%;
   margin: -70px 0 -20px;
   padding: 70px 0 20px;
}

#calendar{
   background: #fcfcfc;
   margin: 10px 10px 10px 10px;
   border: 1px solid #888;

}

JS

var calHeight = $(".content").height();

从图像中我认为 calHeight 应该给出大约 390，但它在 chrome 中给出 594，在 firefox 中给出 565。。

我应该怎么做才能使 calHeight 显示的大小？

Answer 1

尝试使用 jQuery.outerHeight()。

http://api.jquery.com/outerHeight/

它返回包含 Margin 和 Padding 的高度。