我在div中创建了具有background-image属性的边框,并且transform:pattern的scale在页面上居中。在chroMe中它工作正常,但在Firefox和IE中它有差距。
如何消除轮廓?
火狐
Internet Explorer
我的HTML代码:
<div class="row ft_copyright">
<div class="container-fluid rebordo rebordo_cr">
<div class="rebordo_l rebordo_copyright"></div>
<div class="rebordo_r rebordo_copyright"></div>
</div>
<div class="container-fluid back_ft_cr">
<p class="copyright">Copyright</p>
</div>
</div>
我的CSS代码:
.ft_copyright { height: 33px; margin-top: -20px;}
.rebordo_copyright {background: url('assets/images/rebordo.png') 0px -20px repeat-x;}
.back_ft_cr {height: 76px; background: #848484; text-align: center; }
/*rebordos*/
.rebordo {height: 20px; margin-top: 0px; }
.rebordo_l { width: 50%; height: 20px; float: left; background-size: 68px 20px; background-repeat: repeat-x; outline: 0; /* flip background vertically */ -webkit-transform:scaleX(-1); -moz-transform:scaleX(-1); -ms-transform:scaleX(-1); -o-transform:scaleX(-1); transform:scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; }
.rebordo_r {width: 50%; height: 20px; float: right; background-size: 68px 20px; background-repeat: repeat-x; outline: 0; }