css - span タグを div の全幅をカバーするようにする

Question

私はhtmlの次の構造を持っています:-

<div>
  <span>
    <a href="wherever">Wherever</a>
  </span>
</div>

スパンが div の幅全体をカバーするようにしたい場合、クロムでそれを行うにはどうすればよいですか?

を使用してcssで試しました

span{
  background:#FFF;
  width:100%;
}

Firefox と IE では動作しますが、Chrome では動作しません。

Answer 1

span要素はインラインです。インライン要素は幅を自動的に調整し、width:式を無視します。

ブロックレベルにする：

span {
    display: block;
}

しかし、それは基本的にただの<div>です。

Answer 2

問題を解決するには 2 つの方法があります。

span タグは、その内容に応じて幅を調整します。したがって、このタグに幅を割り当てるには、フロート左と幅を使用します。

span{
 background:#FFF;
 width:100%;
 float: left;
}

2番目の方法は、コードで表示ブロックを使用することです

 span{
 background:#FFF;
 width:100%;
 display: block;
}

Answer 3

スパンのCSSを次のように変更します。

span {
display: block;
}

Answer 4

これを試して：

div{
    padding:0px;
}
span{
    background:#FFF;
    width:100%;
}