2

次のコードは、親要素の幅の 100% にまたがる疑似要素を作成する必要があります。ただし、これは Firefox では機能しませんが、Chrome では機能します。Firefox は.parent'sを無視するようposition:relativeです。これはバグですか?

HTML

<div class="parent">

</div>

CSS

.parent{
  background:red;
  width:100px;
  height:100px;
  position:relative;
  display:table-cell;
}

.parent:after{
left:0;
  content:'';
  right:0;
  top:10px;
  height:20px;
  background:green;
  position:absolute;
}

ライブデモ

この画像をクロムで見る ここに画像の説明を入力

そして今、この結果をfirefoxで見てください


ここに画像の説明を入力

4

2 に答える 2

1

可能であれば、display:table-cellblockまたはに変更して、inline-blockこのエラーを修正してください。position:relativeまたは、親を に変更しabsoluteます。

于 2012-07-31T08:38:45.813 に答える
0

与えるwidth

  .parent:after{
      left:0;
      content:'';
      right:0;
      top:10px;
      width:100px;
      height:20px;
      background:green;
      position:absolute;
}
于 2012-07-31T09:04:16.770 に答える