IE6 anchor wordwrapping（display：block，width：0）

不幸的是，我們正在開發的這個網站必須與IE6兼容。它包含一個水平塊式菜單，但IE6還有一個問題。IE6 anchor wordwrapping（display：block，width：0）

我有以下代碼：

<html> 
<head> 
<style type="text/css"> 
a { 
display: block; 
width: 0px; 
background-color: red; 
} 
</style> 
</head> 
<body> 
<a href="#">This is a anchor tag</a> 
</body> 
</html>

由於空間的，它包裝在一個新行的每一個字。如果我只需要一條線，我需要做什麼？

謝謝！

來源

2009-12-30 Tijs Hendriks

您明確要求寬度爲0px？爲什麼？在compiant網絡程序中，我預計不會顯示任何內容。 – Edelcom 2009-12-30 10:33:05

添加這個CSS在一個元素：

white-space: nowrap

來源

2009-12-30 10:32:55 Alsciende

完美地工作，謝謝！ – 2009-12-30 10:35:49

這真的是相當黑客，壽。將寬度設置爲0並強制它不能換行？我肯定會不會設置寬度*或*換行，並讓瀏覽器根據其內容爲錨點分配所需的寬度。 – 2009-12-30 10:39:20

你有沒有試過把你的錨點彈入span或div？

來源

2009-12-30 10:29:18 gingerbreadboy

那麼，不要將其寬度設置爲0將是跨瀏覽器的正確方法。

改爲使用float: left如果希望錨點以塊模式顯示但不分配100％寬度。

當您使用這樣的花車，你還需要確保你clear他們，使他們在容器佔據的空間：

<div> 
    <a ... /> 
    <a ... /> 
    <div style="clear: both;"></div> 
</div>

來源

2009-12-30 10:30:03

錨標記已經有float：left，但是如果我沒有將它的寬度設置爲0，它會自動調整爲100％。但是，它應該具有所需的文字。 – 2009-12-30 10:33:33

它沒有從您向我們展示的代碼中留下浮動，並且它看起來也不像它，因爲浮動的元素不會自動承擔100％的寬度。以供參考：http：//jsbin.com/ozola/edit（點擊'輸出'查看代碼是如何呈現的） – 2009-12-30 10:37:39

IE6 anchor wordwrapping（display：block，width：0）

回答

相關問題