Chrome以不同的方式調整圖像的大小

Question

我正在使用的東西http://pastebin.com/3CSs2tCA

您可以將其粘貼到此處。 http://htmledit.squarefree.com/

在Firefox中，如果窗口寬度小於786px，則徽標會變小並保持其比率。在Chrome瀏覽器（以及我的手機）中，圖片保持其高度並變得粗糙。不知道該如何改變才能解決問題。

Answer 1

非常感謝Freenode的#css頻道上的善良人士提供了答案。

舊代碼：

@media only screen and (max-width: 786px) { 

#logo { 
    vertical-align: middle; 
    display: table-cell; 
    height: 100%; 
    width: 100%; 
    min-width: 75px; 
    min-height: 75px; 
} 

改變的高度，以最大高度：100％，和寬度爲自動。

@media only screen and (max-width: 786px) { 

    #logo { 
     vertical-align: middle; 
     display: table-cell; 
     max-height: 100%; 
     width: auto; 
     min-width: 75px; 
     min-height: 75px; 
    }