title: How to center an image horizontally while pushing the bottom (unknown resolution) and keep centered if window is too narrow
body: <p>Let's say I have an image of <strong>unknown resolution</strong>. I want to center it horizontally, <strong>even if the window is narrower than the picture</strong>, and push the bottom of the window to fit the height of this picture.</p>
  
  <p>How can I achieve that with <strong>css only</strong>? (no javascript)</p>
  
  <p>Obviously the picture will be in an &lt; img > tag since this is the only way to push the bottom. Align it center is easy, the hard part is to keep it centered <strong>just like a background-position:center top</strong> because when simply centering this &lt; img > tag it will hit the left border of the window instead of overflowing hidden and staying centered.</p>
  
  <p>Thanks!</p>