Question

我在我正在建设的网站中使用了许多伪元素。除IE之外，它们看起来都很棒。我正在IE 10和11中测试它以开始。

由于某种原因，定位总是稍微偏离 - 在下面的示例中，每个元素大约5 px。

我尝试更改显示和位置，设置原点，但似乎没有任何效果。

任何帮助都将不胜感激。

.home .welcome-row h1 {
position: relative;
margin-bottom: 0;
}

.home .welcome-row  h1:before {
background-image: url('/wp-content/uploads/2017/10/welcome-line-1.png');
-webkit-transform: translateY(-23px);
-moz-transform: translateY(-23px);
-o-transform: translateY(-23px);
transform: translateY(-23px);
background-size: 260px 13px;
background-repeat: no-repeat;
width: 260px;
height: 13px;
content:"";
position: absolute;
display: block;
}

.home .welcome-row  h1:after {
background-image: url('wp-content/uploads/2017/10/welcome-line-2.png');
-webkit-transform: translateY(5px);
-moz-transform: translateY(5px);
-o-transform: translateY(5px);
transform: translateY(5px);
background-size: 260px 13px;
background-repeat: no-repeat;
width: 260px;
height: 13px;
content:"";
position: absolute;
display: block;
}

*编辑 - 我添加了任何其他主题样式，只要它们具有任何相关性。

*:after,
*:before {
box-sizing:border-box
}

:-webkit-any(article,aside,nav,section) h1 {
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
}

user agent stylesheet
    h1 {
        -webkit-margin-before: 0.67em;
        -webkit-margin-after: 0.67em;
        -webkit-margin-start: 0px;
        -webkit-margin-end: 0px;
    }

 h1 {
    margin: 0;
    padding: 0;
}

转换：翻译定位错误Internet Exploerer

0 个答案: