IE7 中对 :after 的支持

发布于 2024-12-27 10:57:24 字数 712 浏览 3 评论 0原文

长话短说，我想在另一个元素之后添加一个绝对定位的伪元素，因此我只需在样式表中使用 :after 伪元素。除了在 IE7 中之外，这就像一个魅力。我认为 IE7 应该支持 :after ，不是吗？ Boilerplate 中使用的 clearfix hack 效果很好，那么为什么不在我的示例中呢？

当我在样式检查器中查看 CSS 时，它似乎确实将其打印出来，因此在我看来它可以理解它，但我仍然看不到生成的元素。我错过了什么吗？

.myclass:after { 
   content:"";
   display:table;
   width:100px;
   height:100px;
   background:#f7f7f7;
   position:absolute;
   top:0;
   left:-1px;
   z-index:0; }
.myclass > div {
   position:relative;
   z-index:10; }   
.myclass { 
   z-index:1;
   position:relative; }

这是一个小提琴！

原文

Long story short, I want to add an absolutely positioned pseudo element after another element, so I simply use the :after pseudo element in my stylesheet. This works like a charm, except in IE7. I should think that :after is supported in IE7, no? The clearfix hack used in Boilerplate works fine, so why not in my example?

When I look at the CSS in the style inspector, it does seem to print it out, so it seems to me that it understands it, but I can't see the generated element nonetheless. Am I missing something?

.myclass:after { 
   content:"";
   display:table;
   width:100px;
   height:100px;
   background:#f7f7f7;
   position:absolute;
   top:0;
   left:-1px;
   z-index:0; }
.myclass > div {
   position:relative;
   z-index:10; }   
.myclass { 
   z-index:1;
   position:relative; }

Here's a Fiddle!

分享到QQ

分享到微博