Chrome以不同方式调整div中的图像大小

Question

我现在正在使用什么http://pastebin.com/3CSs2tCA

您可以将其粘贴到此处。 http://htmledit.squarefree.com/

在 Firefox 中，如果窗口宽度小于 786 像素，则徽标会变小并保持其比例。在 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;
    }