文章/答案/技术大牛

发布

社区首页 >问答首页 >负定位<hr>上的<hr>伪元

问负定位<hr>上的<hr>伪元
EN

Stack Overflow用户

提问于 2012-06-21 11:48:17

回答 1查看 1.9K关注 0票数 2

我试图在:before和:after伪元素上对<hr>进行负面定位，但是IE10很固执，只是没有显示这些元素。

下面是我的例子：http://jsfiddle.net/Shpigford/HyVMR/

这在除IE10之外的所有浏览器中似乎都很好。它没有显示左块和右块。

它对<div>很好，但是使用<hr>会导致左伪元素根本不出现。

CSS：

hr {
    background:red;
    margin:0 150px;
    height:50px;
    position:relative;
}
hr:before {
    content: '';
    position:absolute;
    height:50px;
    left:-150px;
    width:150px;
    background:green;
}
hr:after {
    content: '';
    position:absolute;
    height:50px;
    right:-150px;
    width:150px;
    background:blue;
}

html

css

pseudo-element

internet-explorer-10

回答 1

Stack Overflow用户

发布于 2012-06-22 10:27:19

尝试overflow:visible; on <hr>

hr {
background:red;
margin:0 150px;
height:50px;
position:relative;
overflow:visible;

}

票数 15

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/11137484

复制

相似问题

问负定位<hr>上的<hr>伪元
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问负定位<hr>上的<hr>伪元EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问负定位<hr>上的<hr>伪元
EN