title: position: absolute without setting top/left/bottom/right?
body: <h2>Case #1:</h2>
  
  <p>I want to put a logo above the photo in the header in the default WordPress theme ( <a href="http://twentyelevendemo.wordpress.com/" rel="noreferrer">http://twentyelevendemo.wordpress.com/</a> )</p>
  
  <p>My solution: add the logo before the photo, and set <code>position: absolute</code> on it, <strong>without</strong> setting any of the <code>top/left/bottom/right</code> properties:</p>
  
  <p><a href="http://jsfiddle.net/TsAJp/" rel="noreferrer">http://jsfiddle.net/TsAJp/</a></p>
  
  <p>Html:</p>
  
  <pre><code>&lt;a id="header"&gt;
    &lt;img id="logo"&gt; 
    &lt;img id="photo"&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>Css:</p>
  
  <pre><code>#logo {
    position: absolute;
    margin: 10px;
    /* or padding: 10px; */
    /* or border: 10px solid transparent;
       only this works with my elderly iPhone Simulator.app */
  }
  </code></pre>
  
  <h2>Case #2:</h2>
  
  <p>Another example is a horizontal multi-level menu which is 100% wide and laid out with <code>display: table-*</code>, but <code>table-cell</code>s don't support <code>position: relative</code>, so my only solution was this: <a href="http://jsfiddle.net/pCe49/" rel="noreferrer">http://jsfiddle.net/pCe49/</a></p>
  
  <p>It works on IE6-7, Firefox1.5, not working on Firefox 0.8, etc.</p>
  
  <p>Do you think it is a good solution, or is it a non-standard piece of hack, which can fall apart any minute?</p>