如何使用css设置锚点标记文本宽度？

Question

我有如下HTML和CSS -

.title { 
     display: block; background-color: red; 
    } 

<a href="#"> 
    <span class="title">Text</span> 
</a> 

我可以看到SPAN跨越到可用的宽度（因为display: block）的100％。像下面一样

|----------------------------------------------------| 
| Text            | 
|----------------------------------------------------| 

在Firefox中，我可以点击上面框中的任意位置，然后将我带到链接页面。但是，在IE（IE 7）中，只有当我将鼠标悬停在“文本”文本上时，才会将光标放在手边。

在IE中我需要做些什么才能使它工作（和FF中一样）？

我试着将锚标记本身（不仅仅是文本）放在span中，但它不起作用。

谢谢。

Answer 1

样式锚和删除跨度。

（该问题是由于一些浏览器如何处理是display: block是display: inline内部元素的元素，你可以解决它的造型既锚和跨度，但跨度在这个例子中出现多余的）

Answer 2

为您的<a>标签，使样式“显示：块;宽度：100％;”

Answer 3

当然，您需要删除跨度并将该类应用于锚标记。我不认为你需要明确地将宽度设置为100％，但我可能是错的。

Answer 4

删除额外的跨度并将该标题类放置在链接本身上。然后添加宽度：100％;到CSS。

减少标记通常更好，这就是为什么你应该删除额外的跨度。

Answer 5

，你也可以用保证金或填充

Answer 6

给一个风格锚display:block和max-width:30px !important;最大宽度尺寸可以是任何

li a { 
    display: block; 
    height: 30px; 
    max-width: 30px !important; 
}