Html 使 span 标签覆盖整个 div 宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14746560/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
making span tag cover entire width of div
提问by user1439090
I have the following structure for html:-
我有以下 html 结构：-
<div>
<span>
<a href="wherever">Wherever</a>
</span>
</div>
If I want the span to cover the entire width of the div, how can I do that in chrome?
如果我希望跨度覆盖 div 的整个宽度，我该如何在 chrome 中做到这一点？
I tried in css using
我在 css 中尝试使用
span{
background:#FFF;
width:100%;
}
It works in firefox and ie but not in chrome.
它适用于 Firefox 和 ie，但不适用于 chrome。
回答by Blender
spanelements are inline. Inline elements adjust their width automatically and ignore your width:expressions.
span元素是内联的。内联元素会自动调整其宽度并忽略您的width:表达式。
Make it block-level:
使其成为块级：
span {
display: block;
}
But then it's basically just a <div>.
但它基本上只是一个<div>.
回答by aishazafar
There are two ways to resolve your issue.
有两种方法可以解决您的问题。
As span tags adjust their width according to the contents in it. So to assign width to this tag we will use float left with width.
由于 span 标签根据其中的内容调整其宽度。所以为了给这个标签分配宽度，我们将使用浮动左带宽度。
span{
background:#FFF;
width:100%;
float: left;
}
secod way is to use display block with the code
第二种方法是在代码中使用显示块
span{
background:#FFF;
width:100%;
display: block;
}
回答by KBN
Change span's CSS to:
将跨度的 CSS 更改为：
span {
display: block;
}
回答by Muzafar Ali
Try this:
尝试这个：
div{
padding:0px;
}
span{
background:#FFF;
width:100%;
}
