title: Angular 2 change position of element
body: <p>In a component template I have an image.
  Dependent on a boolean I want to place another image on top of it.
  The end result looks something like this: <a href="https://i.stack.imgur.com/yXhMb.png" rel="noreferrer"><img src="https://i.stack.imgur.com/yXhMb.png" alt="enter image description here"></a></p>
  
  <p>The second image is the green selector image.
  In order to do so, I need to place the selector image dependent on the dimensions of the main title image.
  ETA: Some images are higher than wide whereas others are wider then high. The top offset of the selector image is therefor dependent on the actual height of the title image.</p>
  
  <p>I have an event handler for the <code>load</code> event of the images and when both are loaded I want to do the positioning.
  Both images are available in the component via <code>@ViewChild</code>.
  I tried to set the <code>offsetTop</code> and <code>offsetLeft</code> properties of the <code>nativeElement</code> but they are read-only. I have verified that I have both images in my <code>load</code> handler with the correct dimensions.</p>
  
  <p>How can I do that in either the template itself or in my <code>load</code> handler?</p>