Height innerHeight outerHeight in jQuery is explained by an example

Standard browser:

Height: height

-blair: you know, we're doing the innerHeight
OuterHeight: height + padding + border. If the parameter is true, height + padding + border + margin

HTML code:

 
<div class="width: 150px;height:20px;float: left;border: 2px solid red;margin: 10px;margin: 10px;padding: 10px;" id="test">jjjjj</div> 

Js code:

 
alert($("#test").height()); 
alert($("#test").innerHeight()); 
alert($("#test").outerHeight()); 
alert($("#test").outerHeight(true)); 

Results:
Results in ie: 17px, 37px, 41px, 61px
Results in ff: 20px, 40px, 44px, 64px

HTML code:

 
<div class="width: 150px;height: 41px;float: left;border: 2px solid red;margin: 10px;margin: 10px;padding: 10px;" id="test">jjjjj</div> 

Js code:

 
alert($("#test").height()); 
alert($("#test").innerHeight()); 
alert($("#test").outerHeight()); 
alert($("#test").outerHeight(true)); 
[html] 
 Results:  
 in ie Results: 17px . 37px . 41px . 61px 
 in ff Results: 41px . 61px . 65px . 85px 

html Code:  
[code] 
<div class="width: 150px;height: 42px;float: left;border: 2px solid red;margin: 10px;margin: 10px;padding: 10px;" id="test">jjjjj</div> 

Js code:
The same code at the page code block index 1
Results:
Results in ie: 18px, 38px, 42px, 62px
Results in ff: 42px, 62px, 66px, 86px

HTML code:

 
<div class="width: 150px;height: 60px;float: left;border: 2px solid red;margin: 10px;margin: 10px;padding: 10px;" id="test">jjjjj</div> 

Js code:
The same code at the page code block index 1
Results:
Results in ie: 36px, 56px, 60px, 80px
Results in ff: 60px, 80px, 84px, 104px

Conclusion: in ie height includes border and padding with a minimum height of 17px, and width is equal to 15px