CSS Calc Viewport Units Workaround?

Question

From what I\'ve seen in other answers, CSS viewport units can\'t be used in calc() statements yet. What I would like to achieve is the following statement:

Answer 1

As a workaround you can use the fact percent vertical padding and margin are computed from the container width. It's quite a ugly solution and I don't know if you'll be able to use it but well, it works: http://jsfiddle.net/bFWT9/

    
        
    
    
        
It works!
    

---

html, body, div {
    height: 100%;
}
body {
    margin: 0;
}
div {
    box-sizing: border-box;
    margin-top: -75%;
    padding-top: 75%;
    background: #d35400;
    color: #fff;
}