JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>
outer div height = <span id="div-target"></span>
<br/>
ul height (including margins) = <span id="ul-target"></span>
<br/>
<br/>
<div show-height-in='div-target'>
    <ul show-height-in='ul-target'>here</ul>
</div>

CSS

div{overflow:auto;}

JavaScript

var app = angular.module('application',[]);
app.directive('showHeightIn', function($log){
    return function(scope, element,attrs) {
        $('#' + attrs.showHeightIn).text($(element).outerHeight(true));
    }
});
angular.bootstrap(document, ['application']);