用css左右固定图像位置

我想放一个左右固定图像，我不知道为什么右边的图像没有固定时才会右移。这是我的代码：用css左右固定图像位置

<img src="img/leftImage.jpg" id="leftImage" /> 
<img src="img/rightImage.jpg" id="rightImage" />

和我的CSS：

#leftImage{ 
    left: 0; 
    width: 150px; 
    height: 100%; 
    position: fixed; 
} 

#rightImage{ 
    right: 0; 
    width: 150px; 
    height: 100%; 
    position: fixed; 
}

谁能帮助我？谢谢！

编辑

这是我的index.html：

<body ng-cloak> 
    <img src="img/leftImage.jpg" id="leftImage" /> 
    <div id="homescreen" class="container"> 
     <div ui-view></div> 
    </div> 
    <img src="img/rightImage.jpg" id="rightImage" /> 
    <footer></footer> 
</body>

和我有CSS：

body { 
    background: url(/img/background.jpg) repeat fixed; 
    background-position-y: -50px; 
    background-position-x: -50px; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 

#homescreen { 
    margin-top: 150px; 
}

容器是引导类。

来源

2017-04-16 Motomine

它的所有罚款，你所做的一切。我认为你的CSS被其他风格所覆盖。你可以分享你所有的CSS吗？ – Lucian

似乎工作正常。 – cosmoonot

我刚刚添加了关于该问题的更多代码。 – Motomine

你忘了添加值top

做这样的事情：

#leftImage { 
    top: 20px; /* your required value */ 
    left: 0; 
    width: 150px; 
    height: 100%; 
    position: fixed; 
} 

#rightImage { 
    top: 20px; /* your required value */ 
    right: 0; 
    width: 150px; 
    height: 100%; 
    position: fixed; 
}

来源

2017-04-16 18:55:37 Lucian

是的！这样做解决了我的问题！我以为我可能不需要那个。谢谢！ – Motomine

你总是需要这样做，因为如果你不使用它，默认情况下它会根据HTML中的内容位置进行定位。即使它适合你，它也不会被交叉浏览。所以请始终记住这一点。不要忘记接受答案，并乐观向上 – Lucian

我已经upvoted并接受它。感谢您的建议，我是开发人员，而不是设计师，所以这些评论对我来说都非常有用！ – Motomine

用css左右固定图像位置

回答

相关问题