Safari 100％的高度和寬度異常

我有一個標誌，我想調整到全寬和相對高度使用媒體查詢，它可以在除Safari之外的每個瀏覽器都很好地工作。Safari 100％的高度和寬度異常

Safari在整個屏幕上呈現圖像，而不是保持寬高比。

我的HTML

<div id="logo"><a href="http://www.stilundso.de/"><img src="http://lorempixel.com/output/technics-h-c-200-206-2.jpg" width="200" height="206"></a></div>

我的CSS

div#logo {background:#fff; width:200px; border-right:1px solid #FFF; height:206px; position:absolute; top:0; left:0; padding-top:41px;} 

@media only screen and (max-width:206px) { 
    div#logo {display:block; position:static; padding:0; border-right:none; width:auto; height:auto;} 
    div#logo img {height:100%; width:100%;} 
}

這裏有一個。

任何幫助表示讚賞。

UPDATE：

現在而不是工作在Safari在Safari瀏覽器在我的iPhone 3G。有任何想法嗎？

來源

2013-07-16 Manticore

使用height:auto;而不是我發現的作品，並且在Safari中不會導致此問題。

來源

2013-07-16 11:21:34

好吧，現在我覺得有點愚蠢。我甚至沒有嘗試過，因爲在開發人員工具中，它被彷彿被img高度和寬度html屬性覆蓋。 – Manticore

不要覺得愚蠢！我以前在iOS設備上遇到過這個問題，並發現這樣可以很好地解決這個問題。 –

Safari 100％的高度和寬度異常

回答

相關問題