左边距没有'在Firefox中无法正常工作

Margin-left doesn't work properly in Firefox

本文关键字：常工作 工作 Firefox 左边      更新时间：2023-09-26

在我的代码中，margin-left:在Firefox和所有其他浏览器中以两种不同的方式工作。

在Firefox上，边际只有"真实"边际的20%。我尝试了@-moz-document url-prefix() { }，但它并没有解决问题，它将显示的图像和"汽车开始移动的真实位置"都移动到了更大的范围。

这是我的代码：

<section id="home" >        
    <div id="home1inner">
        <div id="header">
           *lots of content here*
        </div>
        <img id="cars" src="images/cars.png" />
    </div>  
 </section>

  #home {   
    position: relative;
    width: calc(100% + 25px);
    overflow-y: scroll;
    background-image: url('images/movie_6.jpg');
    background-repeat: no-repeat;
    background-position: center;
    height: 690px;
    margin-top: 40px;
}
  #home1inner {
    height: 1550px;
    overflow: hidden;
    position: relative;
}    
  #cars {
    position: absolute;
    height: 690px;
    bottom: -500px;
    margin-left: -300px;
    pointer-events: none;
}

以下是网站本身，您可以在这里查看Firefox和任何其他浏览器之间的差异：http://denea.comeze.com/

有什么办法吗？

在Firefox中，您的cars ID默认位于页面中央。

只需添加left: 0，如下所示：

#cars {
    position: absolute;
    height: 690px;
    bottom: -500px;
    margin-left: -300px;
    pointer-events: none;
    left: 0;
}

它将从你想要的页面上的位置开始。

相关文章：