直列塊元素的背景延伸到最大寬度，而不是與該內容 - 在IE7器（Internet Explorer 7）

Question

在我解釋，這裏的示例HTML代碼：

[Demo on jsFiddle here.]

<div class="righty"> 
    <p id="breadcrumbs"> 
     <a href="http://example.com">Nerd Archive</a> » <a href="http://example.com/how-to/">Coding</a> 
    </p> 
</div>​ 

和CSS：

#breadcrumbs { 
    font-size: 11px; 
    font-weight: bold; 
    display: inline-block; 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    max-width: 600px; 
    background: #D9ECFF; 
    padding: 1px 3px; 
} 

max-width屬性似乎與IE7完全兼容，但是應該填充元素內容寬度的元素（在這種情況下爲麪包屑）的背景在IE7中擴展爲全角。這裏是去截圖對比：

元素在IE7：

元素在現代瀏覽器，Chrome瀏覽器的最新版本，例如：

是有辦法解決這個問題？希望我很清楚。謝謝！

Answer 1

唯一的問題是，IE7不理解display: inline-block上不是自然內聯的元素，如。 You can make it work using this：

display: inline-block; 
*display: inline; 
zoom: 1; 

http://jsfiddle.net/thirtydot/s4DGB/4/