Is there a CSS way to position an HTML element vertically following the golden ratio?

Question

I want to position an HTML element in the horizontal middle and vertical golden ratio with CSS only. The height of the element must be absolutly flexible, so I can not just set

Answer 1

Okay, I've tested this and it appears to work. The trick though requires the two divs, inner and dummy to have exactly the same contents. dummy is used to give the outer div the appropriate height so that the inner div can be positioned by a percentage of that height. A bit hacky but no javascript.

http://jsfiddle.net/fVQeC/4/

    

        Something
too
more
more
more
more
    
    

        Something
too
more
more
more
more
    

---

.outer{
    position: absolute;
    top: 38.2%;
}

.inner{
    width: 200px;
    background-color: blue;
    position: absolute;
    top: -38.2%;
}

.dummy{
    width: 200px; 
   visibility: hidden; 
}