Svg爲絕對中心 - 如何保持比例

Question

這是我的代碼：http://jsfiddle.net/uorto4ny/2/

我試圖讓一個流體大小的SVG留在頁面的中間，並保持它的比例。到目前爲止，它在Chrome上工作，但在IE和Firefox中，它並沒有保持其比例（一方比另一方足夠長，儘管它們應該是相同的）。

這是我的CSS：

* { 
    padding: 0; 
    margin: 0; 
} 
body { 
    font-family:"Helvetica Neue", Arial, Helvetica, sans; 
    background: #f4f4f4 url('http://www.clker.com/cliparts/c/H/Y/E/V/s/theta-400x400.svg') no-repeat center center fixed; 
    -moz-background-size: cover; 
    -webkit-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    background-size: 25% 25%; 
} 
a { 
    position: absolute; 
    bottom: 0; 
    right: 0; 
    margin: 0px 10px 10px 0px; 
    padding: 10px 18px; 
    text-decoration: none; 
    font-size: 12px; 
    text-align: center; 
    background-color: #FFF; 
    color: rgba(0, 0, 0, 0.44); 
    border-radius: 5px; 
    border: 1px solid rgba(0, 0, 0, 0.15); 
    transition: background-color 0.3s ease 0s; 
} 
a:hover { 
    background-color: rgba(87, 173, 104, 1); 
    border: 1px solid rgba(87, 173, 104, 1); 
    color: white; 
} 

誰能請告訴我，我錯了？

詹姆斯

Answer 1

在這裏工作的例子http://jsfiddle.net/uorto4ny/3/

只要改變你的背景大小的這個

-webkit-background-size: 25%; 
-moz-background-size: 25%; 
-ms-background-size: 25%; 
-o-background-size: 25%; 
background-size: 25%;