title: Nested directive inside template is placed at the top
body: <p>I'm having issues with an angularjs directive I'm attempting to make.</p>
  
  <p>The main directive is called tableu, which has a tableu-heading and a tableu-body, both of which are inside a table like so:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tableu-heading headings='data.format'&gt;
      &lt;/tableu-heading&gt;
      &lt;tableu-body data='data'&gt;
      &lt;/tableu-body&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>The issue is, that in chrome and firefox, (but not in IE8 for some reason) is that the resulting code that is inserted when I envoke the directive is formatted strangly. I end up with;</p>
  
  <pre><code>&lt;tableu&gt;
      &lt;tableu-heading&gt;
      &lt;/tableu-heading&gt;
      &lt;tableu-body&gt;
      &lt;tableu-body&gt;
      &lt;table&gt;
      &lt;/table&gt;
  &lt;/tableu&gt;
  </code></pre>
  
  <p>So that my nested directives are placed inline with table. I've tried a few permutations with transclude thinking that might be the problem but I can't seem to resolve the issue.</p>
  
  <p>My directive code is thus:</p>
  
  <pre><code>angular.module('air.directives.tableu',[])
  
  .directive('tableu', function () {
    return {
      restrict:'EA',
      scope: {
          data: '=',
      },
      templateUrl: 'template/tableu/tableu.html'
    };
  })
  
  .directive('tableuHeading',function() {
    return {
      restrict:'EA',
      replace: false,
      scope: {
          headings: '='
      },
      templateUrl: 'template/tableu/tableu-heading.html',
      compile: function compile(tElement, tAttrs, transclude) {
  
  
          return function link(scope, iElement, iAttrs) {
  
          }
      }
    };
  })
  
  .directive('tableuBody',function() {
    return {
      restrict:'EA',
      transclude: true,
      replace: false,
      templateUrl: 'template/tableu/tableu-body.html',
      compile: function compile(tElement, tAttrs, transclude) {
  
  
          return function link(scope, iElement, iAttrs) {
  
          }
      }
    };
  })
  </code></pre>
  
  <p>Any help you can give would be greatly appreciated - I can't but think the solution is probably obvious.</p>