title: AngularJS: $timeout CSS fixer doesn't run on page load
body: <p>I'm having a devil of a time trying to get a manual HTML layout fixer to run consistently when a route is first loaded. (I'm using Bootstrap, but the client's layout is an unconventional grid.) I've done a lot of searching and tried several fixes. Watching <code>$viewContentLoaded</code> didn't work. Using <code>angular.element(document).ready()</code> was a no-go. Using a standard jQuery <code>$(document).ready()</code> didn't work. <code>ng-init</code> didn't work. Many people suggested using the <code>$timeout</code> service without a specified delay, which supposedly runs after the view is loaded. It's been at least sometimes successful.</p>
  
  <p>Here's the chunk in my controller:</p>
  
  <pre><code>var w = angular.element($window);
  var dimensionFixer = function () {
      angular.element('#home-bottom').css("height", angular.element('#top').height());
      angular.element('#logo-box').css("height", angular.element('#home-top-left').height() - angular.element("#home-top-right-partial").height() - 15);
  };
  w.bind('resize', dimensionFixer);
  $timeout(dimensionFixer);
  </code></pre>
  
  <p>Sometimes it works. Sometimes it doesn't. I've also tried combining <code>$viewContentLoaded</code> and <code>$timeout</code>. It always works on resize. Has <code>$timeout</code> or browser functionality changed?</p>
  
  <p>Thanks!</p>