$（要素）。高さ対$（要素）.css（ '高さ'、値）;

Question

function adjustHeight(){ 
      var headerHeight=$(element).find('.header').outerHeight(); 
      console.log(headerHeight); 
      var temp=$(window).height()-headerHeight; 
      console.log(temp); 
      $('.users').height(temp); 
     } 

一度最初に、ウィンドウ上.users要素の

高さのサイズを変更する呼び出しは常に一時変数を慰めているものよりも30ピクセル以上です。

 $('.users').css('height',temp+'px'); 

これは正常に動作します。

<div class="mainPage" data-bind="visible:mode() === 'authenticated',handleHeightOfElements:''"> 
    <div class="header"> 
     <div> 
      This is header text 
     </div> 
    </div> 
    <div class="mainBody"> 
     <div class="users"> 

      All users: 
      <div data-bind="foreach:userList"> 
       <div class="user"> 
        <span data-bind="text:$data.userName,css:{onlineUser:$data.online()}"> 
        </span> 
        </div> 
       </div> 
     </div> 

.users{ 
float: left; 
width: 140px; 
background: antiquewhite; 
padding: 15px; 
box-sizing:border-box; 
} 

Answer 1

まず：.css("height")と.height()は同等です。

しかし、あなたは$(window).height()マイナス('.header').outerHeight()

.outerHeight()の結果の計算は要素のパディング、マージンやボーダーを含んでいるtempで$('.users').height(temp)を設定します。

.css("height")または.height()のケースではありません。

30pxオフセットは余白/パディング/ボーダーから来ると思います。
の場合は、最後の編集padding: 15px;と一致します。ここで

EDIT
は、あなたの計算誤差が画像化されている：

暗くなった部分は、あなたの計算で考慮されていません。